*
*/
.o-ratio--2\:1:before {
padding-bottom: 50%;
}
.o-ratio--4\:3:before {
padding-bottom: 75%;
}
.o-ratio--16\:9:before {
padding-bottom: 56.25%;
}
/* stylelint-enable */
/* ==========================================================================
#CROP
========================================================================== */
/**
* Provide a cropping container in order to display media (usually images)
* cropped to certain ratios.
*
* 1. Set up a positioning context in which the image can sit.
* 2. This is the crucial part: where the cropping happens.
*/
.o-crop {
position: relative; /* [1] */
display: block;
overflow: hidden; /* [2] */
}
/**
* Apply this class to the content (usually `img`) that needs cropping.
*
* 1. Image’s default positioning is top-left in the cropping box.
* 2. Make sure the media doesn’t stop itself too soon.
*/
.o-crop__content {
position: absolute;
top: 0; /* [1] */
left: 0; /* [1] */
max-width: none; /* [2] */
}
/**
* We can position the media in different locations within the cropping area.
*/
.o-crop__content--right {
right: 0;
left: auto;
}
.o-crop__content--bottom {
top: auto;
bottom: 0;
}
.o-crop__content--center {
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/* stylelint-disable */
/* Crop-ratio variants.
========================================================================== */
/**
* Generate a series of crop classes to be used like so:
*
*
*
*/
.o-crop--2\:1 {
padding-bottom: 50%;
}
.o-crop--4\:3 {
padding-bottom: 75%;
}
.o-crop--16\:9 {
padding-bottom: 56.25%;
}
/* stylelint-enable */
/* ==========================================================================
#TABLE
========================================================================== */
/**
* A simple object for manipulating the structure of HTML `table`s.
*/
.o-table {
width: 100%;
}
/* Equal-width table cells.
========================================================================== */
/**
* `table-layout: fixed` forces all cells within a table to occupy the same
* width as each other. This also has performance benefits: because the browser
* does not need to (re)calculate cell dimensions based on content it discovers,
* the table can be rendered very quickly. Further reading:
* https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout#Values
*/
.o-table--fixed {
table-layout: fixed;
}
/* Size variants.
========================================================================== */
.o-table--tiny th,
.o-table--tiny td {
padding: 6px;
}
.o-table--small th,
.o-table--small td {
padding: 12px;
}
.o-table--large th,
.o-table--large td {
padding: 48px;
}
.o-table--huge th,
.o-table--huge td {
padding: 96px;
}
/* ==========================================================================
#PACK
========================================================================== */
/**
* The pack object simply causes any number of elements pack up horizontally to
* automatically fill an equal, fluid width of their parent.
*
* 1. Fill all available space.
* 2. Remove any leftover styling from lists.
* 3. Cause children to be automatically equally sized.
*/
.o-pack {
width: 100%; /* [1] */
margin-left: 0; /* [2] */
display: table;
table-layout: fixed; /* [3] */
}
/**
* 1. Cause children to adopt table-like structure.
*/
.o-pack__item {
display: table-cell; /* [1] */
/* Vertical alignment variants.
====================================================================== */
}
.o-pack--middle > .o-pack__item {
vertical-align: middle;
}
.o-pack--bottom > .o-pack__item {
vertical-align: bottom;
}
/* Unequal-width items.
========================================================================== */
.o-pack--auto {
table-layout: auto;
}
/* Size variants.
========================================================================== */
.o-pack--tiny {
border-spacing: 6px;
}
.o-pack--small {
border-spacing: 12px;
}
.o-pack--large {
border-spacing: 48px;
}
.o-pack--huge {
border-spacing: 96px;
}
/* Reversed order packs
========================================================================== */
.o-pack--rev {
direction: rtl;
}
.o-pack--rev > .o-pack__item {
direction: ltr;
}
/* ===== SVG ICONS ==========================================================
Author: Simon Allin | SEPT 2020
========================================================================== */
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* COMPONENT --------------------------- */
/* Loop sizes to create class names */
.ai-appico-x-small {
display: flex;
width: 14px;
height: 14px;
}
.ai-appico-small {
display: flex;
width: 18px;
height: 18px;
}
.ai-appico-medium {
display: flex;
width: 22px;
height: 22px;
}
.ai-appico-large {
display: flex;
width: 26px;
height: 26px;
}
.ai-appico-x-large {
display: flex;
width: 32px;
height: 32px;
}
.ai-appico-xx-large {
display: flex;
width: 40px;
height: 40px;
}
/* ===== AI BUTTON COMPONENT =======================================================
Author: Simon Allin | Original: 2016 | Revision: 2020
================================================================================= */
/* DOCUMENT INFORMATION
- Access Intelligence / RS rebrand core button styling
+-------------------------+
| |
| PRESS THE BUTTON! |
| |
+-------------------------+
*/
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* ELEMENT SPECIFIC --------------------------- */
button {
margin-top: 0;
border: none;
}
/* COMPONENT STYLING --------------------------- */
.button {
display: inline-block;
*display: inline;
margin-bottom: 0;
padding: 10px 9px;
background-color: #16cbbe;
text-decoration: none;
border-radius: 0;
font-size: 1.8rem;
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
line-height: 1.1;
color: #FFF;
vertical-align: middle;
cursor: pointer;
text-align: center;
*zoom: 1;
}
.button:hover {
background-color: #119d93;
text-decoration: none;
}
.button--white {
background-color: #FFF;
}
.button--white:hover {
background-color: #e6e6e6;
color: #FFF;
}
.button--white:focus {
background-color: #e6e6e6;
color: #FFF;
}
.button--white--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #FFF;
color: #FFF;
}
.button--white--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #cccccc;
color: #cccccc;
}
.button--white:disabled {
background-color: white;
cursor: auto;
}
.button--white:focus {
-webkit-box-shadow: 0px 0px 6px 0px #FFF;
box-shadow: 0px 0px 6px 0px #FFF;
box-shadow: inset 0 -4px #e0e0e0;
}
.button--green {
background-color: #16cbbe;
}
.button--green:hover {
background-color: #119d93;
color: #FFF;
}
.button--green:focus {
background-color: #119d93;
color: #FFF;
}
.button--green--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #16cbbe;
color: #16cbbe;
}
.button--green--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #0c6f68;
color: #0c6f68;
}
.button--green:disabled {
background-color: #88f2ea;
cursor: auto;
}
.button--green:focus {
-webkit-box-shadow: 0px 0px 6px 0px #16cbbe;
box-shadow: 0px 0px 6px 0px #16cbbe;
box-shadow: inset 0 -4px #10948a;
}
.button--java {
background-color: #16cbbe;
}
.button--java:hover {
background-color: #119d93;
color: #FFF;
}
.button--java:focus {
background-color: #119d93;
color: #FFF;
}
.button--java--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #16cbbe;
color: #16cbbe;
}
.button--java--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #0c6f68;
color: #0c6f68;
}
.button--java:disabled {
background-color: #88f2ea;
cursor: auto;
}
.button--java:focus {
-webkit-box-shadow: 0px 0px 6px 0px #16cbbe;
box-shadow: 0px 0px 6px 0px #16cbbe;
box-shadow: inset 0 -4px #10948a;
}
.button--magenta {
background-color: #ff5892;
}
.button--magenta:hover {
background-color: #ff2571;
color: #FFF;
}
.button--magenta:focus {
background-color: #ff2571;
color: #FFF;
}
.button--magenta--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #ff5892;
color: #ff5892;
}
.button--magenta--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #f10054;
color: #f10054;
}
.button--magenta:disabled {
background-color: #fff1f6;
cursor: auto;
}
.button--magenta:focus {
-webkit-box-shadow: 0px 0px 6px 0px #ff5892;
box-shadow: 0px 0px 6px 0px #ff5892;
box-shadow: inset 0 -4px #ff1b6a;
}
.button--blue {
background-color: #54a3d8;
}
.button--blue:hover {
background-color: #2e8ccb;
color: #FFF;
}
.button--blue:focus {
background-color: #2e8ccb;
color: #FFF;
}
.button--blue--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #54a3d8;
color: #54a3d8;
}
.button--blue--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #256fa1;
color: #256fa1;
}
.button--blue:disabled {
background-color: #d1e6f4;
cursor: auto;
}
.button--blue:focus {
-webkit-box-shadow: 0px 0px 6px 0px #54a3d8;
box-shadow: 0px 0px 6px 0px #54a3d8;
box-shadow: inset 0 -4px #2c86c2;
}
.button--vuelio-brand-pink {
background-color: #ff5892;
}
.button--vuelio-brand-pink:hover {
background-color: #ff2571;
color: #FFF;
}
.button--vuelio-brand-pink:focus {
background-color: #ff2571;
color: #FFF;
}
.button--vuelio-brand-pink--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #ff5892;
color: #ff5892;
}
.button--vuelio-brand-pink--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #f10054;
color: #f10054;
}
.button--vuelio-brand-pink:disabled {
background-color: #fff1f6;
cursor: auto;
}
.button--vuelio-brand-pink:focus {
-webkit-box-shadow: 0px 0px 6px 0px #ff5892;
box-shadow: 0px 0px 6px 0px #ff5892;
box-shadow: inset 0 -4px #ff1b6a;
}
.button--vuelio-brand-blue {
background-color: #264592;
}
.button--vuelio-brand-blue:hover {
background-color: #1b326a;
color: #FFF;
}
.button--vuelio-brand-blue:focus {
background-color: #1b326a;
color: #FFF;
}
.button--vuelio-brand-blue--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #264592;
color: #264592;
}
.button--vuelio-brand-blue--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #111f41;
color: #111f41;
}
.button--vuelio-brand-blue:disabled {
background-color: #7693db;
cursor: auto;
}
.button--vuelio-brand-blue:focus {
-webkit-box-shadow: 0px 0px 6px 0px #264592;
box-shadow: 0px 0px 6px 0px #264592;
box-shadow: inset 0 -4px #192e61;
}
.button--ai-brand-blue {
background-color: #161E36;
}
.button--ai-brand-blue:hover {
background-color: #070a12;
color: #FFF;
}
.button--ai-brand-blue:focus {
background-color: #070a12;
color: #FFF;
}
.button--ai-brand-blue--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #161E36;
color: #161E36;
}
.button--ai-brand-blue--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: black;
color: black;
}
.button--ai-brand-blue:disabled {
background-color: #425aa3;
cursor: auto;
}
.button--ai-brand-blue:focus {
-webkit-box-shadow: 0px 0px 6px 0px #161E36;
box-shadow: 0px 0px 6px 0px #161E36;
box-shadow: inset 0 -4px #04060b;
}
.button--rs-brand-blue {
background-color: #1067b0;
}
.button--rs-brand-blue:hover {
background-color: #0c4c81;
color: #FFF;
}
.button--rs-brand-blue:focus {
background-color: #0c4c81;
color: #FFF;
}
.button--rs-brand-blue--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #1067b0;
color: #1067b0;
}
.button--rs-brand-blue--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #083053;
color: #083053;
}
.button--rs-brand-blue:disabled {
background-color: #68b3f1;
cursor: auto;
}
.button--rs-brand-blue:focus {
-webkit-box-shadow: 0px 0px 6px 0px #1067b0;
box-shadow: 0px 0px 6px 0px #1067b0;
box-shadow: inset 0 -4px #0b4678;
}
.button--rs-brand-orange {
background-color: #ef8f03;
}
.button--rs-brand-orange:hover {
background-color: #bd7102;
color: #FFF;
}
.button--rs-brand-orange:focus {
background-color: #bd7102;
color: #FFF;
}
.button--rs-brand-orange--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #ef8f03;
color: #ef8f03;
}
.button--rs-brand-orange--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #8a5302;
color: #8a5302;
}
.button--rs-brand-orange:disabled {
background-color: #fed08d;
cursor: auto;
}
.button--rs-brand-orange:focus {
-webkit-box-shadow: 0px 0px 6px 0px #ef8f03;
box-shadow: 0px 0px 6px 0px #ef8f03;
box-shadow: inset 0 -4px #b36b02;
}
.button--chambray {
background-color: #3c668d;
}
.button--chambray:hover {
background-color: #2d4c69;
color: #FFF;
}
.button--chambray:focus {
background-color: #2d4c69;
color: #FFF;
}
.button--chambray--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #3c668d;
color: #3c668d;
}
.button--chambray--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #1e3245;
color: #1e3245;
}
.button--chambray:disabled {
background-color: #92b2d0;
cursor: auto;
}
.button--chambray:focus {
-webkit-box-shadow: 0px 0px 6px 0px #3c668d;
box-shadow: 0px 0px 6px 0px #3c668d;
box-shadow: inset 0 -4px #2a4762;
}
.button--orange {
background-color: #ff9f6f;
}
.button--orange:hover {
background-color: #ff7d3c;
color: #FFF;
}
.button--orange:focus {
background-color: #ff7d3c;
color: #FFF;
}
.button--orange--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #ff9f6f;
color: #ff9f6f;
}
.button--orange--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #ff5b09;
color: #ff5b09;
}
.button--orange:disabled {
background-color: white;
cursor: auto;
}
.button--orange:focus {
-webkit-box-shadow: 0px 0px 6px 0px #ff9f6f;
box-shadow: 0px 0px 6px 0px #ff9f6f;
box-shadow: inset 0 -4px #ff7632;
}
.button--red {
background-color: #ff7979;
}
.button--red:hover {
background-color: #ff4646;
color: #FFF;
}
.button--red:focus {
background-color: #ff4646;
color: #FFF;
}
.button--red--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #ff7979;
color: #ff7979;
}
.button--red--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #ff1313;
color: #ff1313;
}
.button--red:disabled {
background-color: white;
cursor: auto;
}
.button--red:focus {
-webkit-box-shadow: 0px 0px 6px 0px #ff7979;
box-shadow: 0px 0px 6px 0px #ff7979;
box-shadow: inset 0 -4px #ff3c3c;
}
.button--tuna {
background-color: #323645;
}
.button--tuna:hover {
background-color: #1d1f27;
color: #FFF;
}
.button--tuna:focus {
background-color: #1d1f27;
color: #FFF;
}
.button--tuna--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #323645;
color: #323645;
}
.button--tuna--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #07080a;
color: #07080a;
}
.button--tuna:disabled {
background-color: #757d9b;
cursor: auto;
}
.button--tuna:focus {
-webkit-box-shadow: 0px 0px 6px 0px #323645;
box-shadow: 0px 0px 6px 0px #323645;
box-shadow: inset 0 -4px #181a22;
}
.button--grey {
background-color: #666;
}
.button--grey:hover {
background-color: #4d4d4d;
color: #FFF;
}
.button--grey:focus {
background-color: #4d4d4d;
color: #FFF;
}
.button--grey--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #666;
color: #666;
}
.button--grey--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #333333;
color: #333333;
}
.button--grey:disabled {
background-color: #b3b3b3;
cursor: auto;
}
.button--grey:focus {
-webkit-box-shadow: 0px 0px 6px 0px #666;
box-shadow: 0px 0px 6px 0px #666;
box-shadow: inset 0 -4px #474747;
}
.button--socialmedia {
background-color: #55ACEE;
}
.button--socialmedia:hover {
background-color: #2795e9;
color: #FFF;
}
.button--socialmedia:focus {
background-color: #2795e9;
color: #FFF;
}
.button--socialmedia--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #55ACEE;
color: #55ACEE;
}
.button--socialmedia--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #147bc9;
color: #147bc9;
}
.button--socialmedia:disabled {
background-color: #e0f0fc;
cursor: auto;
}
.button--socialmedia:focus {
-webkit-box-shadow: 0px 0px 6px 0px #55ACEE;
box-shadow: 0px 0px 6px 0px #55ACEE;
box-shadow: inset 0 -4px #1d91e8;
}
.button--notification {
background-color: #666;
}
.button--notification:hover {
background-color: #4d4d4d;
color: #FFF;
}
.button--notification:focus {
background-color: #4d4d4d;
color: #FFF;
}
.button--notification--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #666;
color: #666;
}
.button--notification--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #333333;
color: #333333;
}
.button--notification:disabled {
background-color: #b3b3b3;
cursor: auto;
}
.button--notification:focus {
-webkit-box-shadow: 0px 0px 6px 0px #666;
box-shadow: 0px 0px 6px 0px #666;
box-shadow: inset 0 -4px #474747;
}
.button--large {
font-size: 26px;
font-size: 2.6rem;
}
.button--medium {
font-size: 21px;
font-size: 2.1rem;
}
.button--small {
font-size: 16px;
font-size: 1.6rem;
}
.button--full-width {
width: 100%;
}
.button--rs-bar {
margin-top: 8px;
padding: 9px 8px;
margin-right: 8px;
}
.button--link {
padding-right: 32px;
background-image: url(img/button_extensions/mliu_button_link_rev.gif);
background-repeat: no-repeat;
background-position: right center;
}
.button--refresh {
padding-right: 32px;
background-image: url(img/button_extensions/mliu_button_refresh_rev.gif);
background-repeat: no-repeat;
background-position: right center;
}
.button--refresh--rss {
padding-right: 32px;
background-image: url(img/button_extensions/mliu_button_rss_rev.png);
background-repeat: no-repeat;
background-position: right center;
}
.button--refresh--ico-contact {
padding-left: 36px;
background-image: url(svg/ico/btn/ico-btn-contact-us.svg);
background-repeat: no-repeat;
background-position: left 3px center;
}
.button--refresh--ico-contact--grey {
background-image: url(svg/ico/btn/ico-btn-contact-us-grey.svg);
}
.button--refresh--ico-direct-line {
padding-left: 36px;
background-image: url(svg/ico/btn/ico-btn-direct-line.svg);
background-repeat: no-repeat;
background-position: left 3px center;
}
.button--refresh--ico-download {
padding-left: 24px;
background-image: url(svg/ico/btn/ico-download.svg);
background-repeat: no-repeat;
background-size: 17px;
background-position: left 3px center;
}
/* ===== HERO PANEL =========================================================
Author: Simon Allin | Jul 2017 | Revised 2020
========================================================================== */
/* DOCUMENT INFORMATION
-Use for promo hero panels
*/
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* COMPONENT --------------------------- */
.c-ai-hero {
padding-top: 48px;
padding-bottom: 48px;
background: #666;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
z-index: 0;
}
.c-ai-hero--white {
background: #FFF;
}
@media (min-width: 64em) {
.c-ai-hero--offset-sidebar {
width: calc( 100% - 360px );
}
}
.c-ai-hero--cover-img {
background-size: cover;
background-position: center center;
padding-bottom: 0;
}
@media (min-width: 46.25em) {
.c-ai-hero--t-center {
text-align: center;
}
}
.c-ai-hero--height-x-small {
height: 150px;
min-height: 150px;
}
@media (max-width: 61.24em) {
.c-ai-hero--height-x-small {
height: auto;
}
}
.c-ai-hero--height-auto {
height: auto;
min-height: none;
}
.c-ai-hero--height-small {
height: 200px;
min-height: 200px;
}
@media (max-width: 61.24em) {
.c-ai-hero--height-small {
height: auto;
}
}
.c-ai-hero--height-auto {
height: auto;
min-height: none;
}
.c-ai-hero--height-medium {
height: 350px;
min-height: 350px;
}
@media (max-width: 61.24em) {
.c-ai-hero--height-medium {
height: auto;
}
}
.c-ai-hero--height-auto {
height: auto;
min-height: none;
}
.c-ai-hero--height-large {
height: 500px;
min-height: 500px;
}
@media (max-width: 61.24em) {
.c-ai-hero--height-large {
height: auto;
}
}
.c-ai-hero--height-auto {
height: auto;
min-height: none;
}
.c-ai-hero--height-x-large {
height: 700px;
min-height: 700px;
}
@media (max-width: 61.24em) {
.c-ai-hero--height-x-large {
height: auto;
}
}
.c-ai-hero--height-auto {
height: auto;
min-height: none;
}
.c-ai-hero--min-height-250\@wide {
height: auto;
}
@media (min-width: 81.25em) {
.c-ai-hero--min-height-250\@wide {
height: 250px;
min-height: 250px;
}
}
.c-ai-hero--rs-portal-left {
background-image: url(svg/covers/rs/rs-cover-portal-left.svg);
}
.c-ai-hero--rs-portal-left-small {
background-image: url(svg/covers/rs/rs-cover-portal-left--small.svg);
}
.c-ai-hero--rs-portal-left-zoomed {
background-image: url(svg/covers/rs/rs-cover-portal-left--zoomed.svg);
}
.c-ai-hero--rs-portal-right {
background-image: url(svg/covers/rs/rs-cover-portal-right.svg);
}
.c-ai-hero--rs-portal-right-small {
background-image: url(svg/covers/rs/rs-cover-portal-right--small.svg);
}
.c-ai-hero--rs-portal-right-zoomed {
background-image: url(svg/covers/rs/rs-cover-portal-right--zoomed.svg);
}
.c-ai-hero--rs-portal-center {
background-image: url(svg/covers/rs/rs-cover-portal-center.svg);
}
.c-ai-hero--vuelio-portal-left {
background-image: url(svg/covers/vuelio/vuelio-cover-portal-left.svg);
}
.c-ai-hero--vuelio-portal-left-small {
background-image: url(svg/covers/vuelio/vuelio-cover-portal-left--small.svg);
}
.c-ai-hero--vuelio-portal-left-zoomed {
background-image: url(svg/covers/vuelio/vuelio-cover-portal-left--zoomed.svg);
}
.c-ai-hero--vuelio-portal-right {
background-image: url(svg/covers/vuelio/vuelio-cover-portal-right.svg);
}
.c-ai-hero--vuelio-portal-right-small {
background-image: url(svg/covers/vuelio/vuelio-cover-portal-right--small.svg);
}
.c-ai-hero--vuelio-portal-right-zoomed {
background-image: url(svg/covers/vuelio/vuelio-cover-portal-right--zoomed.svg);
}
.c-ai-hero--cover-rs {
background-image: url(svg/covers/rs/RS-homepage-image-1.svg);
}
.c-ai-hero--cover-rs-2 {
background-image: url(svg/covers/rs/RS-homepage-image-2.svg);
}
.c-ai-hero--cover-rs-1 {
background-image: url(svg/covers/rs/RS-homepage-image-1.svg);
}
.c-ai-hero--cover-rs-left-portal {
background-image: url(svg/covers/rs/RS-thank-you-page.svg);
}
.c-ai-hero--cover-pro {
background: url(img/covers/pro/compressed/pro-home-cover.jpg) no-repeat center center;
}
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min--moz-device-pixel-ratio: 2), screen and (-moz-min-device-pixel-ratio: 2), screen and (-o-min-device-pixel-ratio: 2/1), screen and (min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
.c-ai-hero--cover-pro {
background: url(img/covers/pro/compressed/pro-home-cover@2x.jpg) no-repeat center center;
background-size: cover;
}
}
.c-ai-hero--cover-pro-2 {
background: url(img/covers/pro/compressed/pro-home-cover-2.jpg) no-repeat center center;
}
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min--moz-device-pixel-ratio: 2), screen and (-moz-min-device-pixel-ratio: 2), screen and (-o-min-device-pixel-ratio: 2/1), screen and (min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
.c-ai-hero--cover-pro-2 {
background: url(img/covers/pro/compressed/pro-home-cover-2@2x.jpg) no-repeat center center;
background-size: cover;
}
}
.no-flexbox .c-heading--hero {
position: relative;
left: 0;
}
.c-ai-hero__heading-container {
padding-left: 0;
width: 100%;
text-align: center;
}
@media (min-width: 46.25em) {
.c-ai-hero__heading-container {
text-align: left;
}
}
@media (min-width: 46.25em) {
.c-ai-hero__heading-container--t-center {
text-align: center;
}
}
@media (min-width: 46.25em) {
.c-ai-hero__heading-container--narrow {
padding-left: 20%;
}
}
@media (min-width: 81.25em) {
.c-ai-hero__heading-container--narrow {
padding-left: 50%;
}
}
@media (min-width: 46.25em) {
.c-ai-hero__heading-container--left-narrow {
max-width: 50%;
}
}
/* ===== QUOTE =========================================================
Author: Simon Allin | Original 2017 | Revision: 2020
========================================================================== */
/* DOCUMENT INFORMATION
-Use for case study qoutes
+~~~~~~~~~~~~~~+
¦ Img ¦
¦ Title ¦
¦ Date ¦
+~~~~~~~~~~~~~~+
*/
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* COMPONENT --------------------------- */
.c-cs-box {
background-color: #1067b0;
}
.c-cs-box--orange {
background-color: #ff9f6f;
}
.c-cs-box--hero {
clear: both;
margin-bottom: 48px;
background: transparent;
}
@media (min-width: 46.25em) {
.c-cs-box--hero {
float: right;
width: 330px;
clear: none;
margin-bottom: 0;
}
}
.c-cs-box__quote {
padding: 24px;
flex-grow: 1;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
flex-direction: column;
font-size: 2.1rem;
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
line-height: 1.3;
}
.c-cs__quote-sub-text {
margin-top: 3px;
font-style: italic;
color: gray;
font-size: 13px;
font-size: 1.3rem;
}
.c-cs-box__quote-text {
font-size: 2.5rem;
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
line-height: 1.3;
color: #fff;
margin-bottom: 48px;
flex-grow: 1;
}
.c-cs-box__quote-text:before {
display: block;
content: " ";
background-image: url("svg/ico/quote/ai-ico-quote--white.svg");
background-repeat: no-repeat;
background-size: 53px 53px;
height: 53px;
width: 53px;
}
.c-cs-box__quote-text > a {
color: #FFFFFF;
}
.c-cs-box__quote-text > a:hover {
border-bottom: 3px solid #FFFFFF;
}
.c-cs-box--hero .c-cs-box__quote-text {
color: #fff;
}
.c-cs-box--hero .c-cs-box__quote-text:before {
background-image: url("svg/ico/quote/ai-ico-quote--rs-orange.svg");
}
.c-cs-box__quote-text--rs-orange-mark:before {
background-image: url("svg/ico/quote/ai-ico-quote--rs-orange.svg");
}
.c-cs-box__quote-text--rs-orange-mark:before {
background-image: url("svg/ico/quote/ai-ico-quote--rs-blue.svg");
}
.c-cs-box--sml-font .c-cs-box__quote-text {
font-size: 23px;
font-size: 2.3rem;
}
.c-cs-box--sml-font .c-cs-box__quote-text:before {
background-size: 43px 43px;
}
.c-cs-box--sml-font .c-cs-box__quote-link {
font-size: 23px;
font-size: 2.3rem;
}
.c-cs-box__quote-link {
font-family: "Mada", Arial, sans-serif;
font-size: 26px;
font-size: 2.6rem;
line-height: 1.3;
font-weight: 700;
text-align: right;
}
.c-cs-box__quote-link > a {
float: right;
color: #fff;
border-bottom: 3px solid #FFFFFF;
}
.c-cs-box__logo {
background: #FFFFFF;
min-height: 120px;
bottom: 0;
margin-top: auto;
padding: 6px;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
align-items: center;
justify-content: center;
min-height: 200px;
}
.c-cs-box__logo img {
width: auto;
max-width: 97%;
bottom: 0;
height: auto;
max-height: 180px;
}
.c-cs-box__logo--border-orange {
border: 3px solid #ff9f6f;
}
.c-cs-box__logo--border-blue {
border: 3px solid #0085B2;
}
.c-cs__quote-text {
position: relative;
padding-left: 45px;
color: #666;
font-size: 1.6rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 600;
color: #292f33;
}
.c-cs__quote-text:before {
content: " ";
background-image: url("svg/ico/quote/ai-ico-quote--rs-blue.svg");
position: absolute;
left: 0;
top: 24px;
background-repeat: no-repeat;
background-size: 33px 33px;
height: 33px;
width: 33px;
}
.c-cs__quote-text--w-border {
border-top: 2px dotted #cccccc;
padding-top: 24px;
}
/* ======================================================================
client card ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-client-card {
background: #f7f7f7;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}
.c-client-card__body {
padding: 24px;
}
.c-client-card__logo {
background: #FFF;
padding: 12px;
}
.c-client-card__logo > img {
height: auto;
max-width: 100%;
max-height: 100%;
}
.c-client-card__summary {
margin-bottom: 24px;
}
.c-client-card__summary-row {
margin-bottom: 12px;
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
font-weight: 700;
}
/* ======================================================================
flex col system ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-layout--4-col, .c-layout--3-col, .c-layout--2-col {
position: relative;
display: flex;
flex-wrap: wrap;
}
/* all cols have standard margin right */
.c-layout__col {
margin-right: 24px;
display: flex;
flex-direction: column;
}
/* set the slices to flex */
.c-layout--4-col .c-layout__col, .c-layout--3-col .c-layout__col, .c-layout--2-col .c-layout__col {
box-sizing: border-box;
float: left;
}
.c-layout--2-col .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
flex: 0 0 auto;
/* 2 cold biased left [bigger left col] */
}
.c-layout--2-col .c-layout__col:last-of-type {
margin-right: 0;
}
.c-layout--2-col .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
.c-layout--2-col .c-layout__col--large-gutter {
width: webkit-calc((100% - 48px ) / 2);
width: -moz-calc((100% - 48px ) / 2);
width: calc((100% - 48px ) / 2);
margin-right: 48px;
}
.c-layout--2-col .c-layout__col--bias-lc {
width: 53%;
margin-right: 96px;
}
.c-layout--2-col .c-layout__col--bias-rc {
width: webkit-calc(47% - 96px);
width: -moz-calc(47% - 96px);
width: calc(47% - 96px);
}
.c-layout--2-col .c-layout__col--main {
width: webkit-calc(100% - ( 28% + 48px ));
width: -moz-calc(100% - ( 28% + 48px ));
width: calc(100% - ( 28% + 48px ));
}
.c-layout--2-col .c-layout__col--main-filtered {
width: webkit-calc(100% - ( 20% + 48px ));
width: -moz-calc(100% - ( 20% + 48px ));
width: calc(100% - ( 20% + 48px ));
}
.c-layout--2-col .c-layout__col--side {
width: webkit-calc(28% + 24px);
width: -moz-calc(28% + 24px);
width: calc(28% + 24px);
}
.c-layout--2-col .c-layout__col--side-filtered {
width: webkit-calc(20% + 24px);
width: -moz-calc(20% + 24px);
width: calc(20% + 24px);
}
@media (max-width: 34.365em) {
.c-layout--2-col--break-flex\@mobile .c-layout__col {
width: 100%;
flex: none !important;
margin-right: 0;
float: none;
}
}
@media (max-width: 46.24em) {
.c-layout--2-col--break-flex\@tablet .c-layout__col {
width: 100%;
flex: none !important;
margin-right: 0;
float: none;
}
}
@media (max-width: 52.49em) {
.c-layout--2-col--break-flex\@medium .c-layout__col {
width: 100%;
flex: none !important;
margin-right: 0;
float: none;
}
}
@media (max-width: 61.24em) {
.c-layout--2-col--break-flex\@desktop .c-layout__col {
width: 100%;
flex: none !important;
margin-right: 0;
float: none;
}
}
@media (max-width: 63.99em) {
.c-layout--2-col--break-flex\@desktop-medium .c-layout__col {
width: 100%;
flex: none !important;
margin-right: 0;
float: none;
}
}
@media (max-width: 71.865em) {
.c-layout--2-col--break-flex\@desktop-wide .c-layout__col {
width: 100%;
flex: none !important;
margin-right: 0;
float: none;
}
}
@media (max-width: 81.24em) {
.c-layout--2-col--break-flex\@wide .c-layout__col {
width: 100%;
flex: none !important;
margin-right: 0;
float: none;
}
}
.c-layout--3-col {
/* full 3 col calculated (100% - 2 interior spacing units) / 4 */
/* reduce col count at specified mq break */
/* remove flex at desired break */
}
.c-layout--3-col .c-layout__col {
width: webkit-calc((100% - 48px ) / 3);
width: -moz-calc((100% - 48px ) / 3);
width: calc((100% - 48px ) / 3);
flex: 0 0 auto;
/* center baised option [ bigger center col ] */
}
.c-layout--3-col .c-layout__col:nth-of-type(3n) {
margin-right: 0;
}
.c-layout--3-col .c-layout__col--c-bias-lc {
width: webkit-calc(((100% - 600px - 48px ) / 2 ));
width: -moz-calc(((100% - 600px - 48px ) / 2 ));
width: calc(((100% - 600px - 48px ) / 2 ));
}
.c-layout--3-col .c-layout__col--c-bias-center {
width: 600px;
}
.c-layout--3-col .c-layout__col--c-bias-rc {
width: webkit-calc(((100% - 600px - 48px ) / 2 ));
width: -moz-calc(((100% - 600px - 48px ) / 2 ));
width: calc(((100% - 600px - 48px ) / 2 ));
}
@media (max-width: 34.365em) {
.c-layout--3-col-split\@mobile .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
/* take off right margin of every 2nd */
}
.c-layout--3-col-split\@mobile .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 46.24em) {
.c-layout--3-col-split\@tablet .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
/* take off right margin of every 2nd */
}
.c-layout--3-col-split\@tablet .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 52.49em) {
.c-layout--3-col-split\@medium .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
/* take off right margin of every 2nd */
}
.c-layout--3-col-split\@medium .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 61.24em) {
.c-layout--3-col-split\@desktop .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
/* take off right margin of every 2nd */
}
.c-layout--3-col-split\@desktop .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 63.99em) {
.c-layout--3-col-split\@desktop-medium .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
/* take off right margin of every 2nd */
}
.c-layout--3-col-split\@desktop-medium .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 71.865em) {
.c-layout--3-col-split\@desktop-wide .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
/* take off right margin of every 2nd */
}
.c-layout--3-col-split\@desktop-wide .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 81.24em) {
.c-layout--3-col-split\@wide .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
/* take off right margin of every 2nd */
}
.c-layout--3-col-split\@wide .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 34.365em) {
.c-layout--3-col-break-flex\@mobile .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 46.24em) {
.c-layout--3-col-break-flex\@tablet .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 52.49em) {
.c-layout--3-col-break-flex\@medium .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 61.24em) {
.c-layout--3-col-break-flex\@desktop .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 63.99em) {
.c-layout--3-col-break-flex\@desktop-medium .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 71.865em) {
.c-layout--3-col-break-flex\@desktop-wide .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 81.24em) {
.c-layout--3-col-break-flex\@wide .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
.c-layout--4-col {
/* full 4 col calculated (100% - 3 interior spacing units) / 4 */
/* half the col count at specified mq break */
/* remove flex at desired break */
}
.c-layout--4-col .c-layout__col {
width: webkit-calc((100% - 72px ) / 4);
width: -moz-calc((100% - 72px ) / 4);
width: calc((100% - 72px ) / 4);
flex: 0 0 auto;
}
@media (max-width: 34.365em) {
.c-layout--4-col-split\@mobile .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
margin-bottom: 24px;
/* take off right margin of every 2nd */
}
.c-layout--4-col-split\@mobile .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 46.24em) {
.c-layout--4-col-split\@tablet .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
margin-bottom: 24px;
/* take off right margin of every 2nd */
}
.c-layout--4-col-split\@tablet .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 52.49em) {
.c-layout--4-col-split\@medium .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
margin-bottom: 24px;
/* take off right margin of every 2nd */
}
.c-layout--4-col-split\@medium .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 61.24em) {
.c-layout--4-col-split\@desktop .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
margin-bottom: 24px;
/* take off right margin of every 2nd */
}
.c-layout--4-col-split\@desktop .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 63.99em) {
.c-layout--4-col-split\@desktop-medium .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
margin-bottom: 24px;
/* take off right margin of every 2nd */
}
.c-layout--4-col-split\@desktop-medium .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 71.865em) {
.c-layout--4-col-split\@desktop-wide .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
margin-bottom: 24px;
/* take off right margin of every 2nd */
}
.c-layout--4-col-split\@desktop-wide .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 81.24em) {
.c-layout--4-col-split\@wide .c-layout__col {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
margin-bottom: 24px;
/* take off right margin of every 2nd */
}
.c-layout--4-col-split\@wide .c-layout__col:nth-of-type(2n) {
margin-right: 0;
}
}
@media (max-width: 34.365em) {
.c-layout--4-col-break-flex\@mobile .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 46.24em) {
.c-layout--4-col-break-flex\@tablet .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 52.49em) {
.c-layout--4-col-break-flex\@medium .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 61.24em) {
.c-layout--4-col-break-flex\@desktop .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 63.99em) {
.c-layout--4-col-break-flex\@desktop-medium .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 71.865em) {
.c-layout--4-col-break-flex\@desktop-wide .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
@media (max-width: 81.24em) {
.c-layout--4-col-break-flex\@wide .c-layout__col {
flex: none;
float: none !important;
width: 100% !important;
}
}
.c-layout__col:last-of-type {
margin-right: 0;
}
/* no-fex fallback for IE < 11 */
.no-flexbox .c-layout--4-col .c-layout__col {
float: left;
width: webkit-calc((100% - 72px ) / 4);
width: -moz-calc((100% - 72px ) / 4);
width: calc((100% - 72px ) / 4);
}
.no-flexbox .c-layout--3-col .c-layout__col {
float: left;
width: webkit-calc((100% - 72px ) / 3);
width: -moz-calc((100% - 72px ) / 3);
width: calc((100% - 72px ) / 3);
}
.no-flexbox .c-layout--2-col .c-layout__col {
float: left;
width: webkit-calc((100% - 72px ) / 2);
width: -moz-calc((100% - 72px ) / 2);
width: calc((100% - 72px ) / 2);
}
/* ===== AI Footer =========================================================
Author: Simon Allin | 2020
========================================================================== */
/* DOCUMENT INFORMATION
- New AI footer styling
- Comprises legacy code fomr original WP setup
*/
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* COMPONENT --------------------------- */
.c-ai-footer {
background-color: #444444;
text-align: left;
padding: 48px 0;
}
.c-ai-footer__group {
text-size-adjust: 100%;
text-transform: uppercase;
}
.c-ai-footer__group p {
font-size: 14px;
font-weight: 600;
letter-spacing: 1px;
color: #FFF;
}
.c-ai-footer__prod-logo {
height: 28px;
width: 180px;
background-size: 180px;
margin-bottom: 12px;
margin-top: -3px;
}
.c-ai-footer__list {
padding-left: 0;
font-size: 1.4rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 400;
}
.c-ai-footer__list .menu-item, .c-ai-footer__list .c-ai-footer__item {
color: #ccc;
margin-bottom: 6px;
}
.c-ai-footer__list .menu-item--lc, .c-ai-footer__list .c-ai-footer__item--lc {
text-transform: none;
}
.c-ai-footer__list .menu-item a, .c-ai-footer__list .c-ai-footer__link {
color: #ccc;
}
.c-ai-footer__list .menu-item a--system, .c-ai-footer__list .c-ai-footer__link--system {
text-transform: none;
color: #54a3d8;
}
.c-ai-footer__list .menu-item a--system:hover, .c-ai-footer__list .c-ai-footer__link--system:hover {
text-decoration: underline;
}
.c-ai-group-footer {
border-top: 1px solid #ccc;
padding: 48px 0;
display: flex;
flex-direction: column;
}
@media (min-width: 34.375em) {
.c-ai-group-footer {
flex-direction: row;
}
}
.c-ai-group-footer__brand {
display: flex;
flex-direction: column;
justify-content: center;
width: 100%;
font-family: "SurtMedium", sans-serif;
font-weight: 400;
color: #FFF;
text-align: center;
}
@media (min-width: 34.375em) and (max-width: 46.24em) {
.c-ai-group-footer__brand {
width: 50%;
}
}
@media (min-width: 46.25em) {
.c-ai-group-footer__brand {
width: 140px;
margin-right: 12px;
}
}
.c-ai-group-footer__logo-span {
margin-bottom: 12px;
font-family: "Surt", sans-serif;
font-weight: 400;
}
.c-ai-group-footer__logo-span--strong {
font-weight: 400;
font-family: "SurtBold", sans-serif;
}
.c-ai-group-footer__logo {
margin: 24px auto 0 auto;
width: 100px;
height: 100px;
background-size: 100px;
}
footer.sticky {
position: relative;
bottom: 0;
z-index: 2;
padding: 0;
}
@media (min-width: 768px) {
footer.sticky {
position: fixed;
}
}
footer.sticky #small-footer {
margin-top: 0;
}
footer .footer-section {
position: relative;
float: left;
width: 20%;
margin-right: 5%;
font-family: "Mada", Arial, sans-serif;
}
@media (max-width: 760px) {
footer .footer-section {
width: 23%;
}
footer .footer-section:first-child {
width: 32%;
margin-right: 5%;
}
}
/* ===== AI Group Logos =========================================================
Author: Simon Allin | 2021
========================================================================== */
/* DOCUMENT INFORMATION
- New AI group logos
*/
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* COMPONENT --------------------------- */
.c-ai-group-logo {
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
}
@media (max-width: 61.24em) {
.c-ai-group-logo {
margin-bottom: 48px;
}
}
.c-ai-group-logo__text-span {
color: #FFF;
margin-bottom: 12px;
font-size: 1.8rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 400;
}
.c-ai-group-logo__text-span--strong {
font-weight: 600;
}
.c-ai-group-logo__svg {
margin: 24px auto 0 auto;
width: 100px;
height: 100px;
background-size: 100px;
}
.c-ai-group-logo-part-of-ai {
display: flex;
flex-direction: column;
vertical-align: middle;
justify-content: center;
align-items: center;
}
@media (min-width: 46.25em) {
.c-ai-group-logo-part-of-ai {
flex-direction: row;
flex-direction: column;
}
}
.c-ai-group-logo-part-of-ai__text {
color: #161E36;
font-size: 1.8rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 400;
display: flex;
vertical-align: middle;
margin-bottom: 12px;
}
@media (max-width: 46.24em) {
.c-ai-group-logo-part-of-ai__text {
margin-bottom: 12px;
}
}
.c-ai-group-logo-part-of-ai__svg {
width: 200px;
height: 107px;
background-size: 100%;
display: flex;
flex-direction: row;
z-index: 10;
}
.c-ai-group-logo-part-of-ai__svg--inline {
display: inline-flex;
width: 230px;
height: 44px;
margin-left: 12px;
}
.c-ai-group-logo-part-of-ai__svg > div {
width: 50px;
height: 50px;
background-size: 100%;
margin-right: 12px;
}
.c-ai-group-logo-part-of-ai__svg > div:last-of-type {
margin-right: 0;
}
/* ===== FEATURED CONTENT POST =============================================
Author: Ed Patrick | May 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for styling individual featured posts
+~~~~~~~~~~~~~~+
¦ Img ¦
¦ Title ¦
¦ Date ¦
+~~~~~~~~~~~~~~+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* featured news slices / setup flex parent */
.c-fc-news__block--flex-parent {
position: relative;
display: flex;
flex-wrap: wrap;
}
/* creating break flex class name options */
@media (max-width: 34.365em) {
.c-fc-news__block--break-flex\@mobile {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 46.24em) {
.c-fc-news__block--break-flex\@tablet {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 52.49em) {
.c-fc-news__block--break-flex\@medium {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 61.24em) {
.c-fc-news__block--break-flex\@desktop {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 63.99em) {
.c-fc-news__block--break-flex\@desktop-medium {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 71.865em) {
.c-fc-news__block--break-flex\@desktop-wide {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 81.24em) {
.c-fc-news__block--break-flex\@wide {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 34.365em) {
.c-fc-news__block--break-flex\@mobile .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 46.24em) {
.c-fc-news__block--break-flex\@tablet .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 52.49em) {
.c-fc-news__block--break-flex\@medium .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 61.24em) {
.c-fc-news__block--break-flex\@desktop .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 63.99em) {
.c-fc-news__block--break-flex\@desktop-medium .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 71.865em) {
.c-fc-news__block--break-flex\@desktop-wide .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 81.24em) {
.c-fc-news__block--break-flex\@wide .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
.no-flexbox .c-fc-news__block {
overflow: hidden;
}
/* set the slices to flex */
.c-fc-news__block--4-col .c-fc-news__slice, .c-fc-news__block--3-col .c-fc-news__slice, .c-fc-news__block--2-col .c-fc-news__slice {
box-sizing: border-box;
float: left;
}
.c-fc-news__block--2-col .c-fc-news__slice {
width: webkit-calc((100% - 12px ) / 2);
width: -moz-calc((100% - 12px ) / 2);
width: calc((100% - 12px ) / 2);
flex: 0 0 auto;
}
.c-fc-news__block--3-col .c-fc-news__slice {
width: webkit-calc((100% - 24px ) / 3);
width: -moz-calc((100% - 24px ) / 3);
width: calc((100% - 24px ) / 3);
flex: 0 0 auto;
}
.c-fc-news__block--4-col .c-fc-news__slice {
width: webkit-calc((100% - 36px ) / 4);
width: -moz-calc((100% - 36px ) / 4);
width: calc((100% - 36px ) / 4);
flex: 0 0 auto;
}
.c-fc__row-divider {
width: 100%;
flex: 0 0 auto;
border-bottom: 1px solid #cccccc;
margin-bottom: 12px;
}
.c-fc__row-divider--no-margin {
border-bottom: none;
margin-bottom: 0;
}
.no-flexbox .c-fc__row-divider {
clear: both;
}
/* no-fex fallback for IE < 11 */
.no-flex .c-fc-news__block--4-col .c-fc-news__slice {
float: left;
width: webkit-calc((100% - 36px ) / 4);
width: -moz-calc((100% - 36px ) / 4);
width: calc((100% - 36px ) / 4);
}
.no-flex .c-fc-news__block--3-col .c-fc-news__slice {
float: left;
width: webkit-calc((100% - 36px ) / 3);
width: -moz-calc((100% - 36px ) / 3);
width: calc((100% - 36px ) / 3);
}
.no-flex .c-fc-news__block--2-col .c-fc-news__slice {
float: left;
width: webkit-calc((100% - 36px ) / 2);
width: -moz-calc((100% - 36px ) / 2);
width: calc((100% - 36px ) / 2);
}
/* class name to out on each featured item */
.c-fc-item {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: 500; /* horizontal option */
/* make inverted dark option for featured interview */
}
.c-fc-item--horizontal .c-fc-item__img {
width: webkit-calc(43% - 12px);
width: -moz-calc(43% - 12px);
width: calc(43% - 12px);
margin-right: 12px;
margin-bottom: 12px;
float: left;
}
.c-fc-item--horizontal .c-fc-item__content {
float: left;
width: webkit-calc(100% - (43% + 12px ));
width: -moz-calc(100% - (43% + 12px ));
width: calc(100% - (43% + 12px ));
}
.c-fc-item--horizontal.c-fc-item--interview .c-fc-item__img {
width: webkit-calc(30% - 12px);
width: -moz-calc(30% - 12px);
width: calc(30% - 12px);
}
.c-fc-item--horizontal.c-fc-item--interview .c-fc-item__content {
width: webkit-calc(100% - (30% + 12px ));
width: -moz-calc(100% - (30% + 12px ));
width: calc(100% - (30% + 12px ));
}
.c-fc-item--trans {
background-color: rgba(0, 0, 0, 0.4);
padding: 24px;
}
.c-fc-item--dark {
color: #333;
background-color: #EEEEEE;
padding: 24px;
}
.c-fc-item--light {
color: #333;
background-color: #FFF;
padding: 24px;
}
.c-fc-item--no-padding {
padding: 0;
}
.c-fc-item--card {
width: 75%;
padding: 24px;
padding-right: 24px !important;
}
.c-fc-item--card > img {
width: 100%;
}
.c-fc-item--blog-card {
border-right: none;
}
.c-fc-item--outline {
padding: 24px !important;
border: 2px solid #EEEEEE !important;
}
.c-fc-item--outline-drk-grey {
border: 2px solid #666;
}
.c-fc-item--orange-outline {
border: 3px solid #ff9f6f;
-webkit-box-shadow: 0px 0px 28px -2px rgba(0, 0, 0, 0.39);
-moz-box-shadow: 0px 0px 28px -2px rgba(0, 0, 0, 0.39);
box-shadow: 0px 0px 28px -2px rgba(0, 0, 0, 0.39);
}
.c-fc-item--rs-brand {
background: transparent;
}
.c-fc-item--persona {
color: #0085B2;
height: 100%;
}
.c-ai-fc-item {
background-color: #FFF;
padding: 0;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}
.c-ai-fc-item--outline {
box-shadow: none;
border: 2px solid #d6d7da;
}
.c-ai-fc-item__img img {
width: 100%;
height: auto;
}
.c-ai-fc-item__title {
color: #464a58;
margin-bottom: 12px;
font-size: 2.1rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 500;
line-height: 25px;
}
.c-ai-fc-item__title > a {
color: #464a58;
}
.c-ai-fc-item__title > a:hover {
color: #ff5892;
transition: 0s;
}
.c-ai-fc-item__data {
padding: 24px;
}
.c-ai-fc-item__main {
flex-grow: 1;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
flex-direction: column;
flex-grow: 1;
}
.c-ai-fc-item__meta {
bottom: 0;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
align-items: center;
flex-direction: column;
justify-content: flex-start;
min-height: 50px;
padding: 0 24px 24px 24px;
}
.c-ai-fc-item__date {
width: 100%;
font-size: 1.4rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 400;
margin-bottom: 12px;
color: #84868f;
}
.c-ai-fc-item__cats {
width: 100%;
color: #84868f;
}
.c-ai-fc-item__cats > a {
font-size: 1.4rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 400;
text-transform: uppercase;
color: #84868f;
}
.c-ai-fc-item__cats > a:hover {
text-decoration: underline;
}
/* quote wrapper */
.c-fc-item--matchup {
padding: 24px;
flex-grow: 1;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
flex-direction: column;
}
/* quote text including top quote mark */
.c-fc-item__top {
flex-grow: 1;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
flex-direction: column;
flex-grow: 1;
}
.c-fc-item__bottom {
min-height: 120px;
bottom: 0;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
align-items: center;
justify-content: center;
min-height: 50px;
}
.c-fc-item__bottom .c-fc-item__bottom__link {
bottom: 0;
height: auto;
max-height: 100px;
}
.c-fc-item--blog-card .c-fc-item__title, .c-fc-item--outline .c-fc-item__title {
font-size: 20px;
font-size: 2rem;
}
.c-fc-item__title--line-h {
line-height: 1.6;
}
.c-fc-item {
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 500;
}
@media (max-width: 34.365em) {
.c-fc-item--break-horizontal\@mobile .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 46.24em) {
.c-fc-item--break-horizontal\@tablet .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 52.49em) {
.c-fc-item--break-horizontal\@medium .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 61.24em) {
.c-fc-item--break-horizontal\@desktop .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 63.99em) {
.c-fc-item--break-horizontal\@desktop-medium .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 71.865em) {
.c-fc-item--break-horizontal\@desktop-wide .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 81.24em) {
.c-fc-item--break-horizontal\@wide .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 34.365em) {
.c-fc-item--break-horizontal\@mobile .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 46.24em) {
.c-fc-item--break-horizontal\@tablet .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 52.49em) {
.c-fc-item--break-horizontal\@medium .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 61.24em) {
.c-fc-item--break-horizontal\@desktop .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 63.99em) {
.c-fc-item--break-horizontal\@desktop-medium .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 71.865em) {
.c-fc-item--break-horizontal\@desktop-wide .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 81.24em) {
.c-fc-item--break-horizontal\@wide .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (min-width: 46.25em) {
.c-fc-item--also-read .c-fc-item__img {
float: left;
max-width: 35%;
margin-bottom: 0;
margin-right: 12px;
}
}
.c-fc-item__img {
margin-bottom: 12px;
}
.c-fc-item__img img {
width: 100%;
height: auto;
}
.c-fc-item__title {
color: #333;
display: block;
margin-top: 0;
margin-bottom: 12px;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 500;
letter-spacing: -0.4px;
font-size: 19px;
}
.c-fc-item__title > a {
color: #333;
}
.c-fc-item__title > a:hover {
color: #ff5892;
transition: 0s;
}
.c-fc-item__title--main {
font-size: 28px;
font-size: 2.8rem;
}
.c-fc-item__title--mb {
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 600;
}
.c-fc-item--persona .c-fc-item__title,
.c-fc-item--rs-brand .c-fc-item__title {
color: #1067b0;
font-size: 2.5rem;
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
}
.c-fc-item--rs-brand .c-fc-item__title {
color: #FFF;
}
.c-fc-item__desc {
margin-bottom: 12px;
}
.c-fc-item__text {
margin-top: 0;
margin-bottom: 24px;
}
.c-fc-item--persona .c-fc-item__text,
.c-fc-item--rs-brand .c-fc-item__text {
color: #1067b0;
font-size: 2.1rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 500;
}
.c-fc-item--rs-brand .c-fc-item__text {
color: #FFF;
}
.c-fc-item__svg {
width: 110px;
height: 110px;
margin: 0 auto 12px auto;
background-image: url(svg/ico/ico-product--MCD.svg);
background-repeat: no-repeat;
}
.c-fc-item__svg--JES {
background-image: url(svg/ico/ico-product--JES.svg);
}
.c-fc-item__svg--PRW {
background-image: url(svg/ico/ico-product--PRW.svg);
}
.c-fc-item__svg--MJ {
background-image: url(svg/ico/ico-product--MJ.svg);
}
.c-fc-item__persona-svg {
width: 140px;
height: 140px;
margin: 0 auto 12px auto;
background-image: url(svg/ico/ico-persona-1.svg);
background-repeat: no-repeat;
}
.c-fc-item__persona-svg--1 {
background-image: url(svg/ico/ico-persona-digital-marketer.svg);
}
.c-fc-item__persona-svg--2 {
background-image: url(svg/ico/ico-persona-staff-journo.svg);
}
.c-fc-item__persona-svg--3 {
background-image: url(svg/ico/ico-persona-freelance.svg);
}
.c-fc-item__persona-svg--4 {
background-image: url(svg/ico/ico-persona-pr-pro.svg);
}
.c-fc-item__date {
font-size: 13px;
color: #666;
margin-bottom: 12px;
}
.c-fc-item__label {
display: inline-block;
color: #666;
padding: 12px;
background-color: #cccccc;
}
.c-fc-item__label:hover {
color: #ff5892;
transition: 0s;
}
.strip-tape {
padding: 4px;
background-color: #ccc;
}
.c-feature-quote {
position: relative;
width: 80%;
margin-left: auto;
margin-right: auto;
font-size: 2.1rem;
font-family: "SurtRegular", Trebuchet MS, Arial, sans-serif;
font-weight: 400;
letter-spacing: -0.4px;
text-align: center;
padding: 24px;
color: #1067b0;
background: #FFF;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}
@media (max-width: 34.365em) {
.c-feature-quote--stacked\@mobile {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 46.24em) {
.c-feature-quote--stacked\@tablet {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 52.49em) {
.c-feature-quote--stacked\@medium {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 61.24em) {
.c-feature-quote--stacked\@desktop {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 63.99em) {
.c-feature-quote--stacked\@desktop-medium {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 71.865em) {
.c-feature-quote--stacked\@desktop-wide {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 81.24em) {
.c-feature-quote--stacked\@wide {
width: 100%;
margin-bottom: 48px;
}
}
/* By default, we tilt all our images -2 degrees */
.c-p-grid-item {
transition: all 0.2s ease-in-out;
-webkit-transform: rotate(-1deg);
-moz-transform: rotate(-1deg);
}
.c-p-grid-item--shadow {
-webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
-moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
}
/* Rotate all even images 2 degrees */
.c-p-grid-item:nth-child(even) {
-webkit-transform: rotate(1deg);
-moz-transform: rotate(1deg);
}
/* Don't rotate every third image, but offset its position */
.c-p-grid-item:nth-child(4n), .c-p-grid-item--no-rotate {
-webkit-transform: none;
-moz-transform: none;
position: relative;
top: -3px;
}
/* Rotate every fifth image by 5 degrees and offset it */
.c-p-grid-item:nth-child(5n) {
-webkit-transform: rotate(2deg);
-moz-transform: rotate(2deg);
position: relative;
right: 3px;
}
/* Keep default rotate for every eighth, but offset it */
.c-p-grid-item:nth-child(8n) {
position: relative;
top: 8px;
right: 5px;
}
/* Keep default rotate for every eleventh, but offset it */
.c-p-grid-item:nth-child(11n) {
position: relative;
top: 3px;
left: -5px;
}
.c-p-grid-item:hover {
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
position: relative;
z-index: 5;
filter: grayscale(1);
}
.c-p-grid-item:hover a {
text-decoration: none;
}
.c-p-grid-item--no-hover:hover {
-webkit-transform: none;
-moz-transform: none;
filter: none;
}
.c-p-grid-item-hover:hover {
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
position: relative;
z-index: 5;
filter: grayscale(1);
}
.c-p-grid-item-hover:hover a {
text-decoration: none;
}
.c-p-grid-item--cut:nth-of-type(n+4) {
margin-bottom: 0 !important;
}
.c-p-grid-item__img {
width: 100%;
height: 200px;
overflow: hidden;
}
.c-p-head {
width: 100%;
background: #f4f4f4;
padding: 48px;
margin-bottom: 48px;
}
.c-p-head__img {
min-width: 250px;
margin-right: 24px;
}
.c-p-head__img img {
max-width: 100%;
max-height: 100%;
border: 2px solid #666;
}
.c-p-head__data {
width: 100%;
}
.c-p-text {
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
line-height: 1.5;
}
.c-p-list {
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
line-height: 1.5;
margin-bottom: 24px;
}
.c-p-list ul {
list-style: initial;
margin: initial;
padding: 0 0 0 24px;
}
.c-p-list li {
display: list-item;
margin-bottom: 12px;
}
/* ===== TAG ================================================================
Author: Simon Allin | SEPT 2020
========================================================================== */
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* COMPONENT --------------------------- */
.c-ai-tag {
display: inline-flex;
align-items: center;
justify-content: space-between;
margin-right: 6px;
margin-bottom: 6px;
padding: 4px 8px;
line-height: 1.6;
font-size: 1.6rem;
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
/* set the deafualt to medium */
color: #fff;
border-radius: 500px; /* whatever size the sides will always be round */
background-color: #66a3d1; /* default to rs brand blue */
}
.c-ai-tag--large {
font-size: 18px;
font-size: 1.8rem;
}
.c-ai-tag--small {
font-size: 14px;
font-size: 1.4rem;
}
.c-ai-tag--is-solo {
margin-right: 0;
margin-bottom: 0;
}
.c-ai-tag--border {
background: transparent;
border: solid 2px #eaeaec;
color: #4a4a4a;
}
.c-ai-tag--ico-left {
padding-left: 34px; /* padding set to icon size + 12px */
background-position: center left 6px;
background-size: 22px;
background-repeat: no-repeat;
}
.c-ai-tag--ico-right {
padding-right: 34px; /* padding set to icon size + 12px */
background-position: center right 6px;
background-size: 22px;
background-repeat: no-repeat;
}
.c-ai-tag--ico-right-circle {
background-image: url(svg/ico/ai-app/right-circle.svg);
}
.c-ai-tag--ico-left-circle {
background-image: url(svg/ico/ai-app/left-circle.svg);
}
.c-ai-tag--small.c-ai-tag--ico-right {
padding-right: 30px; /* padding set to icon size + 12px */
background-size: 18px;
}
.c-ai-tag--small.c-ai-tag--ico-left {
padding-right: 30px; /* padding set to icon size + 12px */
background-size: 18px;
}
/* ===== ENTITY CARD ================================================================
Author: Simon Allin | OCT 2020
================================================================================== */
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* COMPONENT --------------------------- */
.c-ai-entity-card {
padding: 24px;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
border-radius: 2px;
background-color: #FFF;
margin-bottom: 24px;
}
.c-ai-entity-card:last-of-type {
padding-right: 24px;
}
.c-ai-entity-card__main {
display: flex;
flex-direction: row;
margin-bottom: 12px;
}
.c-ai-entity-card__img {
width: 80px;
height: 80px;
margin-right: 12px;
border-radius: 50%;
overflow: hidden;
}
.c-ai-entity-card__img > img {
width: 100%;
}
.c-ai-entity-card__main-data {
width: calc(100% - ( 80px + 12px ));
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
}
.c-ai-entity-card__main-title {
font-size: 1.8rem;
font-family: "SurtBold", Trebuchet MS, Arial, sans-serif;
font-weight: 400;
margin-bottom: 12px;
}
.c-ai-entity-card__data-about {
font-size: 16px;
font-size: 1.6rem;
margin-bottom: 12px;
}
/* ===== PRICE CARD ================================================================
Author: Simon Allin | OCT 2020
================================================================================== */
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* COMPONENT --------------------------- */
.c-ai-price-card {
padding: 24px;
border: solid 2px #d6d7da;
background-color: #FFF;
height: 100%;
display: flex;
flex-flow: column;
}
.c-ai-price-card--light-border {
border: solid 2px #eaeaec;
}
.c-ai-price-card__title {
min-height: 50px;
font-size: 2.5rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 500;
border-bottom: solid 2px #eaeaec;
text-transform: uppercase;
padding-bottom: 12px;
margin-bottom: 12px;
line-height: 40px;
}
.c-ai-price-card__summary {
min-height: 50px;
font-size: 1.8rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 500;
margin-bottom: 12px;
}
.c-ai-price-card__main {
flex: 2;
padding-bottom: 12px;
margin-bottom: 24px;
border-bottom: solid 2px #eaeaec;
}
.c-ai-price-card__main--no-cta {
padding-bottom: 0;
margin-bottom: 0;
border-bottom-width: 0;
}
.c-ai-price-card__foot {
min-height: 50px;
display: flex;
justify-content: center;
}
.c-ai-price-card__cost {
text-align: right;
font-size: 3rem;
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
font-weight: 700;
align-items: baseline;
margin-bottom: 24px;
}
.c-ai-price-card__cost-pound {
font-size: 1.6rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 400;
font-size: 23px;
font-size: 2.3rem;
font-weight: 400;
}
.c-ai-price-card__cost-label {
font-size: 20px;
font-size: 2rem;
font-weight: 300;
}
/* ===== AI PRODUCT STYLING =================================================
Author: Simon Allin | SEPT 2021
========================================================================== */
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* COMPONENT --------------------------- */
.ai-product-section {
display: flex;
flex-direction: column;
padding-left: 24px;
padding-right: 24px;
}
@media (min-width: 46.25em) and (max-width: 61.24em) {
.ai-product-section {
padding-left: 48px;
padding-right: 48px;
}
}
@media (min-width: 61.25em) {
.ai-product-section {
max-width: 1300px;
margin: 0 auto;
}
.ai-product-section--fd-row {
flex-direction: row;
}
.ai-product-section--fd-row-reverse {
flex-direction: row-reverse;
}
}
@media (min-width: 61.25em) {
.ai-product-section__info--left {
margin-right: 48px;
}
.ai-product-section__info--right {
margin-left: 48px;
}
.ai-product-section__info--text-center {
text-align: center;
width: auto;
max-width: 85%;
margin: 0 auto;
}
}
@media (min-width: 61.25em) and (max-width: 71.865em) {
.ai-product-section__info {
width: calc(100% - ( 500px + 48px));
}
.ai-product-section__info--text-center {
width: auto;
max-width: 80%;
}
}
@media (min-width: 71.875em) {
.ai-product-section__info {
width: calc(100% - ( 700px + 48px));
}
.ai-product-section__info--text-center {
width: auto;
max-width: 75%;
}
}
.ai-product-section__info--pa-media {
margin-bottom: 36px;
}
@media (max-width: 61.24em) {
.ai-product-section__info--pa-media {
display: flex;
justify-content: center;
margin-bottom: 24px;
}
.ai-product-section__info--pa-media > img {
max-width: 275px;
}
}
@media (min-width: 61.25em) {
.ai-product-section__info--pa-media {
width: calc(100% - ( 300px + 48px));
}
}
@media (max-width: 71.865em) {
.ai-product-section__info--inset-split {
width: 100%;
}
}
@media (min-width: 71.875em) {
.ai-product-section__info--inset-split {
width: 45%;
}
}
@media (min-width: 61.25em) {
.ai-product-section__info--mcd-myacc {
width: 50%;
}
}
.ai-product-section__title {
font-size: 3rem;
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
line-height: 1.4;
margin-bottom: 12px;
}
.ai-product-section__copy {
font-size: 1.8rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 600;
line-height: 1.4;
letter-spacing: -0.3px;
color: #585858;
margin-bottom: 24px;
}
@media (min-width: 61.25em) {
.ai-product-section__copy {
font-size: 2.1rem;
}
}
.ai-product-section__copy--rev {
color: #FFFFFF;
}
.ai-product-section__img {
position: relative;
}
@media (min-width: 61.25em) {
.ai-product-section__img {
width: 700px;
}
}
@media (max-width: 61.24em) {
.ai-product-section__img--pa-media {
display: flex;
justify-content: center;
margin-bottom: 36px;
}
.ai-product-section__img--pa-media > img {
max-width: 275px;
}
}
@media (min-width: 61.25em) {
.ai-product-section__img--pa-media {
width: 300px;
}
}
@media (min-width: 61.25em) {
.ai-product-section__img--mcd-myacc {
width: 50%;
}
}
@media (max-width: 71.865em) {
.ai-product-section__img--inset-split {
width: 100%;
}
}
@media (min-width: 71.875em) {
.ai-product-section__img--inset-split {
width: 55%;
}
}
figure.ai-product-section__img {
margin: 0;
}
.ai-product-section__img--row {
width: 100%;
}
@media (max-width: 61.24em) {
.ai-product-img {
margin-bottom: 48px;
}
}
.ai-product-img.come-in {
-webkit-transform: translateY(90px);
-khtml-transform: translateY(90px);
-moz-transform: translateY(90px);
-ms-transform: translateY(90px);
-o-transform: translateY(90px);
transform: translateY(90px);
-webkit-animation: come-in 2s ease forwards;
-khtml-animation: come-in 2s ease forwards;
-moz-animation: come-in 2s ease forwards;
-ms-animation: come-in 2s ease forwards;
-o-animation: come-in 2s ease forwards;
animation: come-in 2s ease forwards;
-webkit-animation-delay: 0s;
-khtml-animation-delay: 0s;
-moz-animation-delay: 0s;
-ms-animation-delay: 0s;
-o-animation-delay: 0s;
animation-delay: 0s;
}
.ai-product-img--desktop {
width: 100%;
}
@media (min-width: 61.25em) {
.ai-product-img--desktop {
max-width: 700px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--vmd-myacc {
max-width: 600px;
}
}
.ai-product-img--mobile {
width: 400px;
}
@media (min-width: 61.25em) {
.ai-product-img--mobile-overlay-1 {
position: absolute;
bottom: -30px;
right: -60px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--paralax-overlay {
position: absolute;
bottom: -10px;
right: 48px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--3-stack-overlay {
position: absolute;
max-width: 700px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--3-stack-overlay--1 {
right: 180px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--3-stack-overlay--2 {
top: 130px;
right: 90px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--3-stack-overlay--3 {
top: 260px;
right: 0;
}
}
@media (min-width: 61.25em) {
.ai-product-img--overlay {
position: absolute;
max-width: 700px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--overlay-fjp {
max-width: 500px;
top: 150px;
right: -150px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--mb-desktop,
.ai-porduct-img--prw-desktop {
margin-left: -200px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--mb-desktop-right,
.ai-porduct-img--prw-desktop-right {
margin-left: 0;
}
}
@media (min-width: 61.25em) {
.ai-product-img--overlay-mb-mobile,
.ai-product-img--overlay-prw-mobile {
position: absolute;
max-width: 500px;
top: 150px;
right: 0;
}
}
@media (min-width: 61.25em) {
.ai-product-img--overlay-mb-mobile-right,
.ai-product-img--overlay-prw-mobile-right {
right: -180px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--vmd-outlet-search {
max-width: 850px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--vmd-outlet-search--tour {
margin-bottom: 180px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--vmd-outlet-profile {
max-width: 650px;
margin-left: -40px;
}
}
@media (min-width: 71.875em) {
.ai-product-img--vmd-outlet-profile {
max-width: 700px;
margin-left: -40px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--vmd-contact-profile {
max-width: 550px;
position: absolute;
top: 180px;
right: -40px;
}
}
@media (min-width: 71.875em) {
.ai-product-img--vmd-contact-profile {
max-width: 650px;
right: -40px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--vmd-contact-profile--tour {
max-width: 550px;
position: absolute;
top: 180px;
left: -80px;
}
}
@media (min-width: 61.25em) {
.ai-product-img--vmd-contact-profile--tour-right {
right: -80px;
left: auto;
}
}
@media (min-width: 61.25em) {
.ai-product-img--vmd-outlet-search--overlay {
position: absolute;
left: 200px;
top: 250px;
}
}
/* ===== NAVIGATION COMPONENT ================================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-component for universal cross site service navigaiton
+-------------------------------+
| ~ | ~ | ~ | ~ | | ~ |
+-------------------------------+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* calculate a padding using the ico-width */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* parent bar */
.c-nav-prime {
line-height: 1.6;
position: relative;
}
/* actual styled bar */
.c-nav-prime__bar {
background-color: #333333;
height: 55px;
}
.c-nav-prime__bar-rs-brand {
background-color: #FFFFFF;
}
/* responsive option */
.c-nav-prime--desktop-feature {
display: none;
opacity: 0;
}
@media (min-width: 46.25em) {
.c-nav-prime--desktop-feature {
display: block;
opacity: 1;
}
}
/* navigation button */
.c-nav-prime__btn {
float: left;
font-size: 1.6rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 600;
cursor: pointer;
}
.c-nav-prime__btn--app-heading {
font-weight: 700;
font-size: 1.6rem;
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
}
.c-nav-prime__btn--profiles-logged-out {
border-left: 2px solid #5B5B5B;
}
.c-nav-prime__btn.s-active {
background-color: #4c4c4c;
border-bottom: 4px solid #ff5892;
}
.c-nav-prime__btn--pos-static {
position: static !important;
}
.c-nav-prime__btn > a {
color: #FFF;
}
.c-nav-prime__btn > a:hover {
text-decoration: none;
}
@media (min-width: 71.875em) {
.c-nav-prime__btn.open input {
width: 300px;
-webkit-transition: 0.2s;
-moz-transition: 0.2s;
transition: 0.2s;
}
}
@media (min-width: 81.25em) {
.c-nav-prime__btn.open input {
width: 400px;
}
}
.c-nav-prime__bar-rs-brand a.c-nav-prime__btn-link {
color: #666666;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 500;
font-size: 15px;
font-size: 1.5rem;
text-transform: uppercase;
border-bottom: 4px solid #FFFFFF;
padding-top: 4px;
/* active state */
/* current state */
}
.c-nav-prime__bar-rs-brand a.c-nav-prime__btn-link:hover {
background-color: transparent;
}
.c-nav-prime__bar-rs-brand a.c-nav-prime__btn-link--ico {
padding-left: 12px;
}
.c-nav-prime__bar-rs-brand a.c-nav-prime__btn-link--ico-my-acc, .c-nav-prime__bar-rs-brand a.c-nav-prime__btn-link--ico-contact-us, .c-nav-prime__bar-rs-brand a.c-nav-prime__btn-link--ico-login {
padding: 4px 24px 0 24px;
background-image: none;
border-bottom: 4px solid #FFFFFF;
background-position: 14px 11px;
}
@media (max-width: 81.24em) {
.c-nav-prime__bar-rs-brand a.c-nav-prime__btn-link--ico-contact-us {
background-image: url(svg/ico/ai-app/Ico-ai-contact-thick.svg);
background-size: 28px;
background-position-y: 14px !important;
}
}
.c-nav-prime__bar-rs-brand a.c-nav-prime__btn-link.s-active {
background-color: #fff;
border-bottom: 4px solid #ff9f6f;
padding-top: 4px;
}
.c-nav-prime__bar-rs-brand a.c-nav-prime__btn-link.s-current {
background-color: #FFF;
border-bottom: 4px solid #ff9f6f;
padding-top: 4px;
}
.c-nav-prime__bar-rs-brand a.c-nav-prime__btn-link:hover {
background-color: #FFF;
border-bottom: 4px solid #ff9f6f;
padding-top: 4px;
}
/* main nav links style */
.open .c-nav-prime__btn-link {
background-color: #4c4c4c;
border-bottom: 4px solid #ff5892;
}
/* nav button links - main style applied to this */
.c-nav-prime__btn-link {
/* core style */
height: 55px;
display: flex;
align-items: center;
padding-left: 24px;
padding-right: 24px;
border-bottom: 4px solid #333333;
padding-top: 4px;
/* if wide option enabled spacing and font-size reduce */
/* if the links have an ico */
/* special case for RS text logo */
/* for search inputs */
/* subltle hover effect */
/* active state */
/* current state */
}
@media (max-width: 81.24em) {
.c-nav-prime__btn-link--w-optn {
padding-left: 12px;
padding-right: 12px;
font-size: 17px;
font-size: 1.7rem;
padding-left: 12px;
padding-right: 12px;
font-size: 16px;
font-size: 1.6rem;
}
}
.c-nav-prime__btn-link--ico {
background-repeat: no-repeat;
background-position: 18px 24px;
padding-left: 42px;
padding-right: 18px;
}
.c-nav-prime__btn-link--ico-hide-label {
/* manipulate according to breakpoints */
}
@media (max-width: 34.365em) {
.c-nav-prime__btn-link--ico-hide-label\@mobile {
padding-left: 28px !important;
padding-right: 28px !important;
background-position: center center !important;
}
.c-nav-prime__btn-link--ico-hide-label\@mobile .c-nav-prime__btn-label {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 46.24em) {
.c-nav-prime__btn-link--ico-hide-label\@tablet {
padding-left: 28px !important;
padding-right: 28px !important;
background-position: center center !important;
}
.c-nav-prime__btn-link--ico-hide-label\@tablet .c-nav-prime__btn-label {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 52.49em) {
.c-nav-prime__btn-link--ico-hide-label\@medium {
padding-left: 28px !important;
padding-right: 28px !important;
background-position: center center !important;
}
.c-nav-prime__btn-link--ico-hide-label\@medium .c-nav-prime__btn-label {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 61.24em) {
.c-nav-prime__btn-link--ico-hide-label\@desktop {
padding-left: 28px !important;
padding-right: 28px !important;
background-position: center center !important;
}
.c-nav-prime__btn-link--ico-hide-label\@desktop .c-nav-prime__btn-label {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 63.99em) {
.c-nav-prime__btn-link--ico-hide-label\@desktop-medium {
padding-left: 28px !important;
padding-right: 28px !important;
background-position: center center !important;
}
.c-nav-prime__btn-link--ico-hide-label\@desktop-medium .c-nav-prime__btn-label {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 71.865em) {
.c-nav-prime__btn-link--ico-hide-label\@desktop-wide {
padding-left: 28px !important;
padding-right: 28px !important;
background-position: center center !important;
}
.c-nav-prime__btn-link--ico-hide-label\@desktop-wide .c-nav-prime__btn-label {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 81.24em) {
.c-nav-prime__btn-link--ico-hide-label\@wide {
padding-left: 28px !important;
padding-right: 28px !important;
background-position: center center !important;
}
.c-nav-prime__btn-link--ico-hide-label\@wide .c-nav-prime__btn-label {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
.c-nav-prime__btn-link--ico-drop-down {
background-size: 18px;
background-image: url(svg/ico/ico-menu-drop.svg);
background-position: 18px 22px;
}
.c-nav-prime__btn-link--ico-drop-down.s-active {
background-image: url(svg/ico/ico-menu-drop--up.svg);
}
.c-nav-prime__btn-link--ico-help-center, .c-nav-prime__btn-link--ico-my-acc, .c-nav-prime__btn-link--ico-contact-us, .c-nav-prime__btn-link--ico-login {
padding-left: 57px;
padding-right: 18px;
background-image: url(svg/ico/ico-help-centre.svg);
background-size: 33px 33px;
background-position: 14px 14px;
background-position: 14px 11px;
}
.c-nav-prime__btn-link--ico-my-acc {
background-image: url(svg/ico/ico-my-acc.svg);
}
.c-nav-prime__btn-link--ico-contact-us {
background-image: url(svg/ico/ico-contact-us.svg);
}
.c-nav-prime__btn-link--ico-login {
background-image: url(svg/ico/ico-login.svg);
}
.c-nav-prime__btn-link--ico-folders {
padding-left: 49px;
padding-right: 18px;
background-image: url(svg/ico/ico-nav-folders.svg);
background-position: 18px 18px;
background-position: 18px 16px;
}
.c-nav-prime__btn-link--ico-filters {
padding-left: 49px;
padding-right: 18px;
background-size: 21px;
background-image: url(svg/ico/ico-nav-filters.svg);
background-position: 18px 19px;
background-position: 18px 17px;
}
.c-nav-prime__btn-link--ico-compose {
padding-left: 49px;
padding-right: 18px;
background-size: 19px;
background-image: url(svg/ico/ico-nav-compose.svg);
background-position: 18px 19px;
background-position: 18px 18px;
}
.c-nav-prime__btn-link--ico-recieve {
padding-left: 51px;
padding-right: 18px;
background-size: 24px;
background-image: url(svg/ico/ico-nav-receive-2.svg);
background-position: 18px 20px;
background-position: 18px 18px;
}
.c-nav-prime__btn-link--ico-create {
padding-left: 51px;
padding-right: 18px;
background-size: 22px;
background-image: url(svg/ico/ico-nav-create.svg);
background-position: 18px 20px;
background-position: 18px 16px;
}
.c-nav-prime__btn-link--rs {
width: 195px;
background-image: url(svg/brand-logos/responsesource/orange-on-transparent.svg);
background-repeat: no-repeat;
background-position: 22px 16px;
background-position: 22px 16px;
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
background-size: 150px;
}
.c-nav-prime__btn-link--rs-w-circle {
width: 227px;
background-image: url(svg/brand-logos/responsesource/orange-on-transparent.svg);
background-repeat: no-repeat;
background-position: 22px 14px;
background-size: 180px;
width: 227px;
background-position: 22px 14px;
}
.c-nav-prime__btn-link--rs-w-circle:hover {
border-bottom: 4px solid #ff9f6f;
}
.c-nav-prime__btn-link--jes {
width: 244px;
background-image: url(svg/JES-LOGO-REV.svg);
background-repeat: no-repeat;
background-position: 12px 10px;
background-size: 205px;
}
.c-nav-prime__btn-link--prw {
width: 244px;
background-image: url(svg/PRW-LOGO-REV.svg);
background-repeat: no-repeat;
background-position: 12px 10px;
background-size: 200px;
}
.c-nav-prime__btn-link--search {
padding: 0 0 0 0;
border-bottom-width: 0;
}
.c-nav-prime__btn-link--search > input {
width: 180px;
height: 55px;
padding: 16px 12px 12px 48px;
background-color: #525252;
background-image: url(svg/ico/ico-nav-search-3.svg);
background-repeat: no-repeat;
background-size: 20px;
background-position: left 15px top 20px;
font-size: 1.6rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 600;
color: #FFFFFF;
border: none;
border-bottom: 4px solid #525252;
background-position: left 15px top 18px;
}
.c-nav-prime__btn-link--search > input::-webkit-input-placeholder {
color: #FFFFFF;
}
.c-nav-prime__btn-link--search > input:-moz-placeholder {
color: #FFFFFF;
}
.c-nav-prime__btn-link--search > input::-moz-placeholder {
color: #FFFFFF;
}
.c-nav-prime__btn-link--search > input:-ms-input-placeholder {
color: #FFFFFF;
}
@media (min-width: 61.25em) {
.c-nav-prime__btn-link--search > input {
width: 200px;
}
}
.c-nav-prime__btn-link--search > input:focus {
outline: none;
border-bottom: 4px solid #54a3d8;
}
.c-nav-prime__btn-link--folders {
padding-left: 48px;
background-image: url(svg/ico/ico-nav-folders.svg);
background-repeat: no-repeat;
background-size: 24px;
background-position: left 15px top 20px;
}
.c-nav-prime__btn-link:hover {
background-color: #2b2b2b;
border-bottom: 4px solid #54a3d8;
padding-top: 4px;
}
.c-nav-prime__btn-link.s-active {
background-color: #4c4c4c;
border-bottom: 4px solid #ff5892;
padding-top: 4px;
}
.c-nav-prime__btn-link.s-current {
background-color: #3d3d3d;
border-bottom: 4px solid #ff5892;
padding-top: 4px;
}
.open .c-nav-prime__btn-link--search {
border-bottom-width: 0;
padding-top: 0;
}
/* div for the site specific links */
.c-nav-prime__tools {
height: 55px;
border-left: 2px solid #5B5B5B;
}
.c-nav-prime__bar-rs-brand .c-nav-prime__tools {
border-left: none;
padding-left: 18px;
}
/* [4] */
.c-nav-prime__app-switch {
float: left;
width: 55px;
height: 55px;
background-color: #ff9f6f;
background-image: url(svg/ico/ico-waffle.svg);
background-repeat: no-repeat;
background-position: 22px 22px;
background-position: 19px 19px;
background-size: 16px;
}
.c-nav-prime__app-switch:hover {
background-color: #ff8e56;
}
.c-nav-prime__app-switch--RS-CIRCLE {
background-color: #333;
background-image: url(svg/RS-CIRCLE.svg);
background-repeat: no-repeat;
background-position: 10px 10px;
background-size: 40px;
/* if not logged in */
}
.c-nav-prime__app-switch--RS-CIRCLE:hover {
background-color: #2b2b2b;
}
.c-nav-prime__utilities {
float: right;
}
.c-nav-prime__dropdown-section {
padding: 24px 0;
}
.c-nav-prime__dropdown-section--user-name {
padding-top: 0;
}
.c-nav-prime__dropdown-section--w-divider {
border-bottom: 3px solid #e7e7e7;
}
.c-nav-prime__dropdown-section--side-padd {
padding: 24px 24px;
}
.c-nav-prime__dropdown-section:last-of-type {
padding-bottom: 0;
}
.c-nav-prime__dropdown-section--mcd-tools .c-nav-prime__dropdown-list-item {
font-family: "Mada", Arial, sans-serif;
}
.c-nav-prime__dropdown-list {
margin-left: 0;
padding-left: 0;
padding-bottom: 0;
margin-bottom: 0;
margin-top: 0;
}
.c-nav-prime__dropdown-list li {
list-style: none;
list-style-image: none;
}
.c-nav-prime__dropdown-list-item {
font-size: 1.6rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 600;
margin-bottom: 10px;
}
.c-nav-prime__dropdown-list-item:last-of-type {
margin-bottom: 0;
}
.c-nav-prime__dropdown-list-item > a {
color: #292f33;
}
.c-nav-prime__dropdown-list-item > a:hover {
text-decoration: none;
}
.c-nav-prime__dropdown-list-item--active {
border-bottom: 2px solid #ff5892;
}
.c-nav-prime__dropdown-list-link {
display: block;
color: #4B4B4B;
}
.c-nav-prime__dropdown-list-link:hover {
text-decoration: none;
color: #333;
}
.c-nav-prime__dropdown-list-link--w-ico {
padding-left: 40px;
background-repeat: no-repeat;
background-size: 34px;
min-height: 34px;
padding-top: 3px;
}
.c-nav-prime__dropdown-list-link--my-acc {
background-image: url(svg/ico/ico-my-acc-2.svg);
}
.c-nav-prime__dropdown-list-link--my-acc:hover {
background-image: url(svg/ico/ico-my-acc-2-hvr.svg);
}
.c-nav-prime__dropdown-list-link--live-chat {
background-image: url(svg/ico/ico-live-chat-2.svg);
}
.c-nav-prime__dropdown-list-link--live-chat:hover {
background-image: url(svg/ico/ico-live-chat-2-hvr.svg);
}
.c-nav-prime__dropdown-list-link--newsroom-admin {
background-image: url(svg/ico/ico-newsroom-admin-2.svg);
}
.c-nav-prime__dropdown-list-link--newsroom-admin:hover {
background-image: url(svg/ico/ico-newsroom-admin-2-hvr.svg);
}
.c-nav-prime__dropdown-list-link--direct-line {
background-image: url(svg/ico/ico-direct-line.svg);
}
.c-nav-prime__dropdown-list-link--direct-line:hover {
background-image: url(svg/ico/ico-direct-line-hvr.svg);
}
.c-nav-prime__dropdown-list-link--inbox-settings {
background-image: url(svg/ico/ico-inbox-settings-2.svg);
}
.c-nav-prime__dropdown-list-link--return-arrow {
background-image: url(svg/ico/ico-return-arrow.svg);
background-size: 28px;
background-position: 0 3px;
}
.c-nav-prime__dropdown-list-link--search {
background-image: url(svg/ico/ico-search-2.svg);
}
.c-nav-prime__dropdown-list-link--search:hover {
background-image: url(svg/ico/ico-search-2-hvr.svg);
}
.c-nav-prime__dropdown-list-link--view-profile {
background-image: url(svg/ico/ico-view-profile.svg);
}
.c-nav-prime__dropdown-list-link--view-profile:hover {
background-image: url(svg/ico/ico-view-profile-hvr.svg);
}
.c-nav-prime__dropdown-list-link--acc-mgr {
background-image: url(svg/ico/ico-acc-mgr-2.svg);
}
.c-nav-prime__dropdown-list-link--acc-mgr:hover {
background-image: url(svg/ico/ico-acc-mgr-2-hvr.svg);
}
.c-nav-prime__dropdown-list-link--contact-us {
background-image: url(svg/ico/ico-contact-us.svg);
}
.c-nav-prime__dropdown-list-link--contact-us:hover {
background-image: url(svg/ico/ico-contact-us-hvr.svg);
}
.c-nav-prime__dropdown-list-link--dist-compose {
background-image: url(svg/ico/ico-dist-compose.svg);
background-size: 25px;
background-position: 3px 4px;
}
.c-nav-prime__dropdown-list-link--dist-compose:hover {
background-image: url(svg/ico/ico-dist-compose-hvr.svg);
}
.c-nav-prime__dropdown-list-link--dist-drafts {
background-image: url(svg/ico/ico-dist-drafts.svg);
background-size: 22px;
background-position: 5px 3px;
}
.c-nav-prime__dropdown-list-link--dist-drafts:hover {
background-image: url(svg/ico/ico-dist-drafts-hvr.svg);
}
.c-nav-prime__dropdown-list-link--dist-scheduled {
background-image: url(svg/ico/ico-dist-scheduled.svg);
background-size: 29px;
background-position: 3px 4px;
}
.c-nav-prime__dropdown-list-link--dist-scheduled:hover {
background-image: url(svg/ico/ico-dist-scheduled-hvr.svg);
}
.c-nav-prime__dropdown-list-link--dist-sent {
background-image: url(svg/ico/ico-dist-sent.svg);
background-size: 27px;
background-position: 3px 4px;
}
.c-nav-prime__dropdown-list-link--dist-sent:hover {
background-image: url(svg/ico/ico-dist-sent-hvr.svg);
}
.c-nav-prime__dropdown-list-link--dist-mediabank {
background-image: url(svg/ico/ico-dist-mediabank.svg);
background-size: 27px;
background-position: 3px 2px;
}
.c-nav-prime__dropdown-list-link--dist-mediabank:hover {
background-image: url(svg/ico/ico-dist-mediabank-hvr.svg);
}
.c-nav-prime__dropdown-list-link--priv-con-import {
background-image: url(svg/ico/ico-priv-con-import-2.svg);
background-size: 27px;
background-position: 3px 3px;
}
.c-nav-prime__dropdown-list-link--priv-con-import:hover {
background-image: url(svg/ico/ico-priv-con-import-2-hvr.svg);
}
.c-nav-prime__dropdown-list-link--priv-con-add {
background-image: url(svg/ico/ico-priv-con-add.svg);
background-size: 28px;
background-position: 5px 2px;
}
.c-nav-prime__dropdown-list-link--priv-con-add:hover {
background-image: url(svg/ico/ico-priv-con-add-hvr.svg);
}
.c-nav-prime__dropdown-list-link--priv-con-view {
background-image: url(svg/ico/ico-priv-con-view.svg);
background-size: 31px;
background-position: 1px 2px;
}
.c-nav-prime__dropdown-list-link--priv-con-view:hover {
background-image: url(svg/ico/ico-priv-con-view-hvr.svg);
}
/* ===== VUELIO THEMES =================================================================
Author: Simon Allin | Created: 2024
================================================================================= */
/* DOCUMENT INFORMATION
- Generic themes for use on buttons etc
*/
/* Colors ----------------------------------------- */
/* ===== AI THEMES =================================================================
Author: Simon Allin | Created: 2023
================================================================================= */
/* DOCUMENT INFORMATION
- Generic themes for use on buttons etc
*/
/* Setup ----------------------------------------- */
/* Themes Setup ---------------------------------- */
/* ===== AI INFO BOX ===============================================================
Author: Simon Allin | Created: 2023
================================================================================= */
/* DOCUMENT INFORMATION
- Access Intelligence core button styling
+-------------------------+
| |
| INFO IN A BOX!! |
| |
+-------------------------+
*/
/* SETUP --------------------------- */
/* LOCAL SETTINGS / MIXINS --------------------------- */
/* COMPONENT STYLING --------------------------------- */
.c-info-box {
padding: 12px;
margin-bottom: 24px;
border: 1px solid #CCC;
border-radius: 4px;
}
@media (min-width: 46.25em) {
.c-info-box {
font-size: 14px;
font-weight: 400;
}
}
.c-info-box > p {
margin-top: 0;
margin-bottom: 0;
}
.c-info-box > ul {
width: auto;
max-width: 100%;
box-sizing: border-box;
padding: 0 !important;
}
.c-info-box > ul > li {
display: list-item;
width: auto !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
.c-info-box #release_details_intro li {
width: auto;
}
#release_details_intro li {
display: list-item;
padding-left: 0 !important;
padding-right: 0 !important;
}
.c-info-box--theme-dark-blue {
border-color: #40668c;
background-color: transparent;
}
.c-info-box--theme-teal {
border-color: #68b1fe;
background-color: transparent;
}
.c-info-box--theme-blue {
border-color: #4071ff;
background-color: transparent;
}
.c-info-box--theme-pink {
border-color: #ff95ae;
background-color: transparent;
}
.c-info-box--theme-grey {
border-color: #93959d;
background-color: transparent;
}
.c-info-box--theme-red {
border-color: #ff95ae;
background-color: transparent;
}
.c-info-box--theme-green {
border-color: #7fffc5;
background-color: transparent;
}
.c-info-box--theme-dark-green {
border-color: #74d7aa;
background-color: transparent;
}
.c-info-box--theme-orange {
border-color: #ecaddf;
background-color: transparent;
}
.c-info-box--theme-white {
border-color: white;
background-color: transparent;
}
.c-info-box__inline-link {
color: #0042FF;
text-decoration: underline;
}
.c-info-box__list {
margin-bottom: 6px;
padding-left: 30px;
}
.c-info-box__list-item {
margin-bottom: 6px;
}
.c-info-box__list-item a.c-info-box__inline-link {
color: #0042FF;
}
/* ===== BUTTON COMPONENT =======================================================
Author: Simon Allin | 2016 |
========================================================================== */
/* DOCUMENT INFORMATION
-core button styling with various variations
+-------------------------+
| |
| PRESS THE BUTTON! |
| |
+-------------------------+
*/
button {
margin-top: 0;
border: none;
}
.button {
display: inline-block;
*display: inline;
margin-bottom: 0;
padding: 10px 9px;
background-color: #16cbbe;
text-decoration: none;
border-radius: 0;
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
line-height: 1.1;
letter-spacing: normal;
font-weight: 700;
color: #FFF;
vertical-align: middle;
cursor: pointer;
text-align: center;
*zoom: 1;
}
.button:hover {
background-color: #119d93;
text-decoration: none;
}
.button.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.button.not-desktop-feature {
display: none;
opacity: 0;
}
}
.button.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.button.not-mobile-feature {
display: block;
opacity: 1;
}
}
.button--white {
background-color: #FFF;
}
.button--white:hover {
background-color: #e6e6e6;
color: #FFF;
}
.button--white:focus {
background-color: #e6e6e6;
color: #FFF;
}
.button--white--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #FFF;
color: #FFF;
}
.button--white--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #cccccc;
color: #cccccc;
}
.button--white:disabled {
background-color: white;
cursor: auto;
}
.button--white:focus {
-webkit-box-shadow: 0px 0px 6px 0px #FFF;
box-shadow: 0px 0px 6px 0px #FFF;
box-shadow: inset 0 -4px #e0e0e0;
}
.button--green {
background-color: #16cbbe;
}
.button--green:hover {
background-color: #119d93;
color: #FFF;
}
.button--green:focus {
background-color: #119d93;
color: #FFF;
}
.button--green--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #16cbbe;
color: #16cbbe;
}
.button--green--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #0c6f68;
color: #0c6f68;
}
.button--green:disabled {
background-color: #88f2ea;
cursor: auto;
}
.button--green:focus {
-webkit-box-shadow: 0px 0px 6px 0px #16cbbe;
box-shadow: 0px 0px 6px 0px #16cbbe;
box-shadow: inset 0 -4px #10948a;
}
.button--java {
background-color: #16cbbe;
}
.button--java:hover {
background-color: #119d93;
color: #FFF;
}
.button--java:focus {
background-color: #119d93;
color: #FFF;
}
.button--java--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #16cbbe;
color: #16cbbe;
}
.button--java--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #0c6f68;
color: #0c6f68;
}
.button--java:disabled {
background-color: #88f2ea;
cursor: auto;
}
.button--java:focus {
-webkit-box-shadow: 0px 0px 6px 0px #16cbbe;
box-shadow: 0px 0px 6px 0px #16cbbe;
box-shadow: inset 0 -4px #10948a;
}
.button--magenta {
background-color: #ff5892;
}
.button--magenta:hover {
background-color: #ff2571;
color: #FFF;
}
.button--magenta:focus {
background-color: #ff2571;
color: #FFF;
}
.button--magenta--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #ff5892;
color: #ff5892;
}
.button--magenta--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #f10054;
color: #f10054;
}
.button--magenta:disabled {
background-color: #fff1f6;
cursor: auto;
}
.button--magenta:focus {
-webkit-box-shadow: 0px 0px 6px 0px #ff5892;
box-shadow: 0px 0px 6px 0px #ff5892;
box-shadow: inset 0 -4px #ff1b6a;
}
.button--blue {
background-color: #54a3d8;
}
.button--blue:hover {
background-color: #2e8ccb;
color: #FFF;
}
.button--blue:focus {
background-color: #2e8ccb;
color: #FFF;
}
.button--blue--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #54a3d8;
color: #54a3d8;
}
.button--blue--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #256fa1;
color: #256fa1;
}
.button--blue:disabled {
background-color: #d1e6f4;
cursor: auto;
}
.button--blue:focus {
-webkit-box-shadow: 0px 0px 6px 0px #54a3d8;
box-shadow: 0px 0px 6px 0px #54a3d8;
box-shadow: inset 0 -4px #2c86c2;
}
.button--vuelio-brand-pink {
background-color: #ff5892;
}
.button--vuelio-brand-pink:hover {
background-color: #ff2571;
color: #FFF;
}
.button--vuelio-brand-pink:focus {
background-color: #ff2571;
color: #FFF;
}
.button--vuelio-brand-pink--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #ff5892;
color: #ff5892;
}
.button--vuelio-brand-pink--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #f10054;
color: #f10054;
}
.button--vuelio-brand-pink:disabled {
background-color: #fff1f6;
cursor: auto;
}
.button--vuelio-brand-pink:focus {
-webkit-box-shadow: 0px 0px 6px 0px #ff5892;
box-shadow: 0px 0px 6px 0px #ff5892;
box-shadow: inset 0 -4px #ff1b6a;
}
.button--vuelio-brand-blue {
background-color: #264592;
}
.button--vuelio-brand-blue:hover {
background-color: #1b326a;
color: #FFF;
}
.button--vuelio-brand-blue:focus {
background-color: #1b326a;
color: #FFF;
}
.button--vuelio-brand-blue--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #264592;
color: #264592;
}
.button--vuelio-brand-blue--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #111f41;
color: #111f41;
}
.button--vuelio-brand-blue:disabled {
background-color: #7693db;
cursor: auto;
}
.button--vuelio-brand-blue:focus {
-webkit-box-shadow: 0px 0px 6px 0px #264592;
box-shadow: 0px 0px 6px 0px #264592;
box-shadow: inset 0 -4px #192e61;
}
.button--ai-brand-blue {
background-color: #161E36;
}
.button--ai-brand-blue:hover {
background-color: #070a12;
color: #FFF;
}
.button--ai-brand-blue:focus {
background-color: #070a12;
color: #FFF;
}
.button--ai-brand-blue--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #161E36;
color: #161E36;
}
.button--ai-brand-blue--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: black;
color: black;
}
.button--ai-brand-blue:disabled {
background-color: #425aa3;
cursor: auto;
}
.button--ai-brand-blue:focus {
-webkit-box-shadow: 0px 0px 6px 0px #161E36;
box-shadow: 0px 0px 6px 0px #161E36;
box-shadow: inset 0 -4px #04060b;
}
.button--rs-brand-blue {
background-color: #1067b0;
}
.button--rs-brand-blue:hover {
background-color: #0c4c81;
color: #FFF;
}
.button--rs-brand-blue:focus {
background-color: #0c4c81;
color: #FFF;
}
.button--rs-brand-blue--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #1067b0;
color: #1067b0;
}
.button--rs-brand-blue--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #083053;
color: #083053;
}
.button--rs-brand-blue:disabled {
background-color: #68b3f1;
cursor: auto;
}
.button--rs-brand-blue:focus {
-webkit-box-shadow: 0px 0px 6px 0px #1067b0;
box-shadow: 0px 0px 6px 0px #1067b0;
box-shadow: inset 0 -4px #0b4678;
}
.button--rs-brand-orange {
background-color: #ef8f03;
}
.button--rs-brand-orange:hover {
background-color: #bd7102;
color: #FFF;
}
.button--rs-brand-orange:focus {
background-color: #bd7102;
color: #FFF;
}
.button--rs-brand-orange--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #ef8f03;
color: #ef8f03;
}
.button--rs-brand-orange--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #8a5302;
color: #8a5302;
}
.button--rs-brand-orange:disabled {
background-color: #fed08d;
cursor: auto;
}
.button--rs-brand-orange:focus {
-webkit-box-shadow: 0px 0px 6px 0px #ef8f03;
box-shadow: 0px 0px 6px 0px #ef8f03;
box-shadow: inset 0 -4px #b36b02;
}
.button--chambray {
background-color: #3c668d;
}
.button--chambray:hover {
background-color: #2d4c69;
color: #FFF;
}
.button--chambray:focus {
background-color: #2d4c69;
color: #FFF;
}
.button--chambray--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #3c668d;
color: #3c668d;
}
.button--chambray--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #1e3245;
color: #1e3245;
}
.button--chambray:disabled {
background-color: #92b2d0;
cursor: auto;
}
.button--chambray:focus {
-webkit-box-shadow: 0px 0px 6px 0px #3c668d;
box-shadow: 0px 0px 6px 0px #3c668d;
box-shadow: inset 0 -4px #2a4762;
}
.button--orange {
background-color: #ff9f6f;
}
.button--orange:hover {
background-color: #ff7d3c;
color: #FFF;
}
.button--orange:focus {
background-color: #ff7d3c;
color: #FFF;
}
.button--orange--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #ff9f6f;
color: #ff9f6f;
}
.button--orange--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #ff5b09;
color: #ff5b09;
}
.button--orange:disabled {
background-color: white;
cursor: auto;
}
.button--orange:focus {
-webkit-box-shadow: 0px 0px 6px 0px #ff9f6f;
box-shadow: 0px 0px 6px 0px #ff9f6f;
box-shadow: inset 0 -4px #ff7632;
}
.button--red {
background-color: #ff7979;
}
.button--red:hover {
background-color: #ff4646;
color: #FFF;
}
.button--red:focus {
background-color: #ff4646;
color: #FFF;
}
.button--red--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #ff7979;
color: #ff7979;
}
.button--red--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #ff1313;
color: #ff1313;
}
.button--red:disabled {
background-color: white;
cursor: auto;
}
.button--red:focus {
-webkit-box-shadow: 0px 0px 6px 0px #ff7979;
box-shadow: 0px 0px 6px 0px #ff7979;
box-shadow: inset 0 -4px #ff3c3c;
}
.button--tuna {
background-color: #323645;
}
.button--tuna:hover {
background-color: #1d1f27;
color: #FFF;
}
.button--tuna:focus {
background-color: #1d1f27;
color: #FFF;
}
.button--tuna--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #323645;
color: #323645;
}
.button--tuna--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #07080a;
color: #07080a;
}
.button--tuna:disabled {
background-color: #757d9b;
cursor: auto;
}
.button--tuna:focus {
-webkit-box-shadow: 0px 0px 6px 0px #323645;
box-shadow: 0px 0px 6px 0px #323645;
box-shadow: inset 0 -4px #181a22;
}
.button--grey {
background-color: #666;
}
.button--grey:hover {
background-color: #4d4d4d;
color: #FFF;
}
.button--grey:focus {
background-color: #4d4d4d;
color: #FFF;
}
.button--grey--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #666;
color: #666;
}
.button--grey--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #333333;
color: #333333;
}
.button--grey:disabled {
background-color: #b3b3b3;
cursor: auto;
}
.button--grey:focus {
-webkit-box-shadow: 0px 0px 6px 0px #666;
box-shadow: 0px 0px 6px 0px #666;
box-shadow: inset 0 -4px #474747;
}
.button--socialmedia {
background-color: #55ACEE;
}
.button--socialmedia:hover {
background-color: #2795e9;
color: #FFF;
}
.button--socialmedia:focus {
background-color: #2795e9;
color: #FFF;
}
.button--socialmedia--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #55ACEE;
color: #55ACEE;
}
.button--socialmedia--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #147bc9;
color: #147bc9;
}
.button--socialmedia:disabled {
background-color: #e0f0fc;
cursor: auto;
}
.button--socialmedia:focus {
-webkit-box-shadow: 0px 0px 6px 0px #55ACEE;
box-shadow: 0px 0px 6px 0px #55ACEE;
box-shadow: inset 0 -4px #1d91e8;
}
.button--notification {
background-color: #666;
}
.button--notification:hover {
background-color: #4d4d4d;
color: #FFF;
}
.button--notification:focus {
background-color: #4d4d4d;
color: #FFF;
}
.button--notification--rev {
background: none;
border-width: 2px;
border-style: solid;
border-color: #666;
color: #666;
}
.button--notification--rev:hover {
background-color: rgba(255, 255, 255, 0.2);
border-color: #333333;
color: #333333;
}
.button--notification:disabled {
background-color: #b3b3b3;
cursor: auto;
}
.button--notification:focus {
-webkit-box-shadow: 0px 0px 6px 0px #666;
box-shadow: 0px 0px 6px 0px #666;
box-shadow: inset 0 -4px #474747;
}
.button--left {
float: left;
}
.button--right {
float: right;
}
.button--margin_right {
margin-right: 8px;
}
.button--margin_top {
margin-top: 8px;
}
.button--margin_top_xl {
margin-top: 30px;
}
.button--bottom {
margin: 10px 0;
}
.button--margin_bottom_xl {
margin-bottom: 30px;
}
.button--margin_bottom {
margin-bottom: 8px;
}
.button--font_light {
font-weight: lighter;
}
.button--font-plus-1 {
font-size: 18px;
font-size: 1.8rem;
}
.button--font_sml {
font-size: 95%;
}
.button--font_s-m {
font-size: 19px;
font-size: 1.9rem;
}
.button--font_mid {
font-size: 21px;
font-size: 2.1rem;
}
.button--font-lrg {
font-size: 26px;
font-size: 2.6rem;
}
.button--font-sml {
font-size: 16px;
font-size: 1.6rem;
}
.button--font_lrg {
font-size: 200%;
}
.button--stacked {
margin-bottom: 10px;
display: block;
}
.button--block {
display: block;
}
.button--w-100 {
width: 100%;
}
.button--small {
font-size: 16px;
font-size: 1.6rem;
padding: 6px 7px;
}
.button--a-c-view-all {
font-size: 15px;
font-size: 1.5rem;
padding: 6px 7px;
}
.button--add {
padding: 12px;
padding-right: 32px;
background-image: url(svg/ico-plus-actual-17-17.svg);
background-repeat: no-repeat;
background-position: right 10px center;
background-size: 17px;
line-height: 1.3;
}
.button--add-rev {
padding-left: 36px;
background-size: 32px;
background-repeat: no-repeat;
background-position: left 3px center;
background-image: url(svg/ico/btn/ico-add-rev.svg);
}
.button--add-left {
padding-left: 32px;
background-image: url(img/button_extensions/mliu_button_add_rev.gif);
background-repeat: no-repeat;
background-position: 7px center;
}
.button--black.rev.add {
background-image: url(img/button_extensions/mliu_button_add.gif);
}
.button--grey.rev.add {
background-image: url(img/button_extensions/mliu_button_add_grey.gif);
}
.button--grey.rev.add:hover {
background-image: url(img/button_extensions/mliu_button_add_grey_hover.gif);
}
.button--link {
padding-right: 32px;
background-image: url(img/button_extensions/mliu_button_link_rev.gif);
background-repeat: no-repeat;
background-position: right center;
}
.button--black.rev.link {
background-image: url(img/button_extensions/mliu_button_link.gif);
}
.button--refresh {
padding-right: 32px;
background-image: url(img/button_extensions/mliu_button_refresh_rev.gif);
background-repeat: no-repeat;
background-position: right center;
}
.button--view {
padding-right: 34px;
background-image: url(img/button_extensions/mliu_button_view_rev.gif);
background-repeat: no-repeat;
background-position: right center;
}
.button--rss {
padding-right: 32px;
background-image: url(img/button_extensions/mliu_button_rss_rev.png);
background-repeat: no-repeat;
background-position: right center;
}
.button--live-chat {
padding-left: 32px;
background-image: url(svg/ico/btn/ico-btn-live-chat.svg);
background-repeat: no-repeat;
background-position: left 8px center;
}
.button--tick {
padding-left: 36px;
background-image: url(svg/ico/btn/ico-btn-tick.svg);
background-size: 22px;
background-repeat: no-repeat;
background-position: left 8px center;
}
.button--light-grey--rev {
color: gray;
border-color: gray;
}
.button--folders {
padding: 9px 12px 9px 30px;
background-image: url(svg/ico/ico-view-more-drk.svg);
background-size: 17px;
background-repeat: no-repeat;
background-position: 10px center;
font-size: 15px;
font-size: 1.5rem;
}
.button--ico-contact {
padding-left: 36px;
background-image: url(svg/ico/btn/ico-btn-contact-us.svg);
background-repeat: no-repeat;
background-position: left 3px center;
}
.button--ico-contact--grey {
background-image: url(svg/ico/btn/ico-btn-contact-us-grey.svg);
}
.button--ico-direct-line {
padding-left: 36px;
background-image: url(svg/ico/btn/ico-btn-direct-line.svg);
background-repeat: no-repeat;
background-position: left 3px center;
}
.button--ico-download {
padding-left: 24px;
background-image: url(svg/ico/btn/ico-download.svg);
background-repeat: no-repeat;
background-size: 17px;
background-position: left 3px center;
}
.button--rs-bar {
margin-top: 8px;
padding: 9px 8px;
margin-right: 8px;
}
.button--rs-search:before {
content: "Go";
}
@media (min-width: 1152px) {
.button--rs-search:before {
content: "Search";
}
}
.button--search {
padding-left: 33px;
background-image: url(svg/ico/ico-button-search.svg);
background-repeat: no-repeat;
background-position: 8px 9px;
background-size: 22px;
}
.button.button--font-lrg.button--search {
background-position: left 10px center;
padding-left: 36px;
background-size: 19px;
}
.avatar-acc-mgr {
width: 150px;
height: 150px;
background-image: url(svg/ico/avatar/ico-avatar-acc-mgr.svg);
background-repeat: no-repeat;
background-size: 150px;
}
.button--low_key {
border-color: #CCCCCC;
background-color: #E7E7E7;
color: #666;
}
.button--low_key:hover {
background-color: #cecece;
}
.button--simple {
background: transparent;
border: none;
color: #666;
}
.button--simple:hover {
background: transparent;
border: none;
box-shadow: 0 0 0 #999;
text-decoration: underline;
}
.button--transparent {
background-color: transparent;
color: #666;
border: none;
}
.button--transparent:hover {
background-color: transparent;
color: #666;
border: none;
text-decoration: underline;
}
.show-contacts {
float: right;
display: inline;
font-weight: lighter;
}
@media (min-width: 550px) {
.show-contacts {
display: inline-block;
*display: inline;
margin-bottom: 0;
padding: 10px 9px;
background-color: #16cbbe;
text-decoration: none;
border-radius: 0;
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
line-height: 1.1;
letter-spacing: normal;
font-weight: 700;
color: #FFF;
vertical-align: middle;
cursor: pointer;
text-align: center;
*zoom: 1;
border-color: #CCCCCC;
background: #E7E7E7;
color: #666;
font-weight: lighter;
font-size: 108%;
}
.show-contacts:hover {
background-color: #119d93;
text-decoration: none;
}
.show-contacts:hover {
background-color: #cecece;
}
}
/* ===== TAB NAV COMPONENT =======================================================
Author: Simon Allin | 2016 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for page tab navigation
-Includes optional sub level for additional page segregation
+~~~~~~~~~~~~~~+ +~~~~~~~~~~~~~~+
¦ ¦ ¦ ¦
¦ TAB 1 ¦ ¦ TAB 2 ¦
¦ ¦ ¦ ¦
+ +~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~+
*/
/* ======================================================================
core tabs ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-tab-nav {
display: block;
border-bottom: 1px solid #cccccc;
height: 50px;
padding: 0;
}
.c-tab-nav__item {
float: left;
padding: 6px 10px;
margin-right: 8px;
border: 1px solid #e6e6e6;
border-bottom: 0;
color: #999999;
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
height: 49px;
text-decoration: none;
line-height: 1.6;
background-color: #FFF;
padding: 9px 12px;
}
.c-tab-nav__item:hover {
color: #666;
border-color: #cccccc;
text-decoration: none;
}
.c-tab-nav__item.s-active, .c-tab-nav__item.c-tab-nav__item--active {
color: #585858;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 600;
border-color: #999999;
height: 50px;
border-color: #cccccc;
border-top: 2px solid #ff5892;
}
/* ==========================================================================
Sub navigation option ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-tab-nav__sub-level {
border-width: 0 1px 1px 1px;
border-style: solid;
border-color: #cccccc;
}
.c-tab-nav__sub-level-item {
float: left;
margin-top: 18px;
margin-right: 12px;
margin-bottom: -1px;
margin-left: 18px;
padding-bottom: 18px;
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: -0.5px;
font-weight: 300;
color: #999;
cursor: pointer;
font-weight: 500;
text-decoration: none;
}
.c-tab-nav__sub-level-item:hover {
color: #666;
text-decoration: none;
}
.c-tab-nav__sub-level-item.active {
color: #666;
border-bottom: 2px solid #ff5892;
}
/* ---------------------------------------------------------------------
ResponseSource system messages
1) SETUP
2) NOTICE
--------------------------------------------------------------------- */
.system-message {
box-sizing: border-box;
width: 100%;
padding: 25px;
border-bottom: 1px solid #ccc;
z-index: 4;
background: #fff;
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
letter-spacing: -0.5px;
font-weight: 400;
color: #ff9f6f;
text-align: center;
}
.system-message > a:hover {
text-decoration: underline;
}
#RS .system-message {
margin-bottom: 0px;
overflow: hidden;
}
#RS .system-message--impersonation {
margin-top: 0;
}
/* ---------------------------------------------------------------------
#SWITCH LIST | .c-switch-list = core class | -- modifiers
--------------------------------------------------------------------- */
.c-switch__set {
padding: 0;
margin-bottom: 0;
margin-top: 0;
margin-left: 0;
list-style-type: none;
border-width: 2px 0;
border-style: solid;
border-color: #666;
color: #292f33;
}
.c-switch__row {
font-size: 1.6rem;
font-family: "Mada", Arial, sans-serif;
font-weight: 500;
border-bottom: 1px dotted #d3d3d3;
margin-bottom: 0 !important;
display: flex;
flex-direction: row;
min-height: 50px;
align-items: center;
}
@media (min-width: 768px) {
.c-switch__row--2-col {
width: 50%;
width: webkit-calc(50% - 15px);
width: -moz-calc(50% - 15px);
width: calc(50% - 15px);
float: left;
}
.c-switch__row--2-col:nth-child(odd) {
margin-right: 15px !important;
}
.c-switch__row--2-col:nth-child(even) {
margin-left: 15px !important;
}
}
.c-switch__row:first-of-type {
border-top: none;
}
.c-switch__row:last-of-type {
border-bottom: none;
}
.c-switch__row-label {
width: webkit-calc(100% - 60px);
width: -moz-calc(100% - 60px);
width: calc(100% - 60px);
}
.c-switch__toggle {
position: relative;
display: inline-block !important;
width: 60px;
height: 34px;
float: right;
cursor: pointer;
margin-bottom: 0 !important;
/* Hide default HTML checkbox */
}
.c-switch__toggle input {
display: none;
}
.c-switch__toggle-label {
margin-right: 12px;
margin-top: 4px;
color: #666;
float: left;
font-size: 17px;
font-size: 1.7rem;
font-weight: 500;
}
.c-switch__toggle-label--small {
font-size: 14px;
font-size: 1.4rem;
margin-top: 4px;
}
.c-switch__toggle-label--margin-top-10 {
margin-top: 10px;
}
.c-switch__toggle-slider {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ff5892;
-webkit-transition: 0.2s;
transition: 0.2s;
}
.c-switch__toggle-slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: 0.2s;
transition: 0.2s;
}
.c-switch__toggle input:checked + .c-switch__toggle-slider {
background-color: #16cbbe;
}
.c-switch__toggle input:focus + .c-switch__toggle-slider {
box-shadow: 0 0 1px #2196F3;
}
.c-switch__toggle input:checked + .c-switch__toggle-slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}
.c-switch__toggle-text {
position: absolute;
color: #fff;
z-index: 1;
top: 7px;
}
.c-switch__toggle-text--on {
display: none;
left: 6px;
}
.c-switch__toggle-text--off {
right: 6px;
display: block;
}
.c-switch__toggle-text--off-DE {
right: 2px;
}
.c-switch__toggle input:checked ~ .c-switch__toggle-text--off {
display: none;
}
.c-switch__toggle input:checked ~ .c-switch__toggle-text--on {
display: block;
}
.c-pause-toggle {
position: relative;
display: inline-block !important;
float: right;
cursor: pointer;
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
*zoom: 1;
/* Hide default HTML checkbox */
}
.c-pause-toggle:before, .c-pause-toggle:after {
content: " ";
display: table;
}
.c-pause-toggle:after {
clear: both;
}
.c-pause-toggle input {
display: none !important;
}
.c-pause-toggle input:checked + .c-pause-toggle__button {
background-color: #ff5892;
border-color: #ff5892;
}
.c-pause-toggle input:focus + .c-pause-toggle__button {
box-shadow: 0 0 1px #2196F3;
}
.c-pause-toggle input:checked ~ .c-pause-toggle__button .c-pause-toggle__text--off {
display: none;
}
.c-pause-toggle input:checked ~ .c-pause-toggle__button .c-pause-toggle__text--on {
display: block;
color: #FFF;
}
.c-switch__toggle--ios {
border-radius: 50%;
width: 64px;
height: 36px;
}
.c-switch__toggle--ios .c-switch__toggle-slider {
border-radius: 20px;
background: #f8f8f8;
box-shadow: inset 0 0 0 0px rgb(19, 191, 17), 0 0 0 2px #dddddd;
}
.c-switch__toggle--ios .c-switch__toggle-slider:before {
bottom: 0;
left: 0;
width: 36px;
height: 36px;
background: #fff;
border-radius: 50%;
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2), 0 0 0 2px #dddddd;
}
.c-switch__toggle--ios input:checked + .c-switch__toggle-slider {
background: #4cd864;
box-shadow: inset 0 0 0 20px rgb(53, 219, 95), 0 0 0 2px rgb(53, 219, 95);
}
.c-switch__toggle--ios input:checked + .c-switch__toggle-slider:before {
box-shadow: 0 0 0 2px transparent, 0 3px 3px rgba(0, 0, 0, 0.3);
left: 4px;
}
.c-switch__toggle--ios.c-switch__toggle--ios-small {
margin-top: -1px;
width: 42px;
height: 22px;
}
.c-switch__toggle--ios.c-switch__toggle--ios-small .c-switch__toggle-slider:before {
width: 22px;
height: 22px;
}
.c-switch__toggle--ios.c-switch__toggle--ios-small input:checked + .c-switch__toggle-slider:before {
left: -5px;
}
.c-switch__toggle--left {
float: left;
}
.c-pause-toggle__button {
-webkit-transition: 0.2s;
transition: 0.2s;
border: 3px solid #666;
}
.c-pause-toggle__text {
padding: 8px;
padding-left: 24px;
z-index: 1;
top: 7px;
width: 100%;
text-align: center;
}
.c-pause-toggle__text::before {
content: " ";
position: absolute;
left: 10px;
top: 14px;
width: 12px;
height: 16px;
border-right: 4px solid #666;
border-left: 4px solid #666;
}
.c-pause-toggle__text--on {
display: none;
}
.c-pause-toggle__text--on::before {
content: " ";
position: absolute;
width: 12px;
height: 16px;
border-top: 8px solid transparent;
border-left: 12px solid #fff;
border-bottom: 8px solid transparent;
border-right: none;
}
.c-pause-toggle__text--off {
display: block;
}
.c-pause-toggle__input[type=text] {
font-size: 20px;
font-size: 2rem;
width: 120px;
padding: 9px;
}
.o-form-title {
margin-top: 0;
}
.o-form-title--level-2 {
font-family: "Mada", Arial, sans-serif;
font-size: 24px;
font-size: 2.4rem;
letter-spacing: -1px;
font-weight: 300;
color: #292f33;
color: #292f33;
}
.c-form__block {
margin-bottom: 40px;
overflow: auto;
}
.c-set {
list-style-type: none;
margin: 0;
padding: 10px 0;
color: #292f33;
}
.c-set--2px-border {
border-width: 2px 0;
border-style: solid;
border-color: #666;
}
.c-set__row {
margin-bottom: 0 !important;
font-size: 1.6rem;
font-family: "Mada", Arial, sans-serif;
font-weight: 500;
border-bottom: 1px dotted #d3d3d3;
padding-top: 10px;
padding-bottom: 10px;
}
.c-set__row--2-col {
margin: 0;
}
.c-set__row--2-col:nth-last-child(-n+2) {
border-color: #fff;
}
@media (min-width: 768px) {
.c-set__row--2-col {
float: left;
width: 50%;
}
}
/* ==========================================================================
tool 2 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* old version - from MCD */
.toggle-switch {
position: relative;
margin: 20px 0px;
*zoom: 1;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
float: left;
display: inline;
}
.toggle-switch:before, .toggle-switch:after {
content: " ";
display: table;
}
.toggle-switch:after {
clear: both;
}
@media (min-width: 768px) {
.toggle-switch {
margin: 10px 0px;
float: right;
display: inline;
}
}
.toggle-switch__label {
position: absolute;
top: 50%;
transform: translateY(-50%);
font-size: 16px;
font-size: 1.6rem;
}
.toggle-switch__bezel {
position: relative;
float: right;
display: inline;
width: 100px;
overflow: hidden;
cursor: pointer;
border: 4px solid #16cbbe;
}
.toggle-switch__bezel--off {
border-color: #ff5892;
}
.toggle-switch__checkbox {
display: none !important;
}
.toggle-switch__checkbox:checked + .toggle-switch__bezel .toggle-switch__inner {
margin-left: 0;
}
.toggle-switch__checkbox:checked + .toggle-switch__bezel .toggle-switch__switch {
right: 0px;
}
.toggle-switch__inner {
display: block;
width: 200%;
margin-left: -100%;
transition: margin 0.2s ease-in 0s;
}
.toggle-switch__inner:before, .toggle-switch__inner:after {
display: block;
float: left;
width: 50%;
height: 45px;
padding: 0;
line-height: 46px;
color: white;
box-sizing: border-box;
background-clip: padding-box;
}
.toggle-switch__inner:before {
content: "On";
padding-left: 13px;
background-color: #16cbbe;
}
.toggle-switch__inner:after {
content: "Off";
padding-right: 13px;
background-color: #ff5892;
color: #fff;
text-align: right;
}
.toggle-switch__switch {
display: block;
width: 45px;
margin: 0px;
background: white;
position: absolute;
top: 0;
bottom: 0;
right: 50px;
transition: all 0.2s ease-in 0s;
}
/* ===== QTIP OVERRIDES =============================================
| July 2017 |
========================================================================== */
.qtip-bootstrap {
border-radius: 0;
border: 2px solid #ccc;
box-shadow: 0 0 0 rgba(0, 0, 0, 0.2);
}
.qtip-bootstrap--100 {
width: 100px;
max-width: 100px;
}
.qtip-bootstrap--200 {
width: 200px;
max-width: 200px;
}
.qtip-bootstrap--300 {
width: 300px;
max-width: 300px;
}
.qtip-bootstrap--400 {
width: 400px;
max-width: 400px;
}
.qtip-bootstrap--600 {
width: 600px;
max-width: 600px;
}
.qtip-bootstrap--600 .qtip-content {
max-height: 440px;
overflow-y: auto;
}
.qtip-bootstrap p {
margin: 5px;
line-height: 2rem;
}
.qtip-icon, .qtip-icon .ui-icon {
border-radius: 0;
border: none;
}
.qtip-close {
top: 9px;
right: 9px;
}
.qtip-text {
display: none;
}
.qtip-text--medium {
display: none;
}
.qtip-text--large {
display: none;
}
.qtip-icon-container {
display: inline-block;
}
.qtip__title {
margin: 5px;
}
/* ---------------------------------------------------------------------
ResponseSource Nav system
1) SETUP
2) APP MENU
--------------------------------------------------------------------- */
.rs-nav-menu-product-search-regions, .rs-nav-menu-product-search-topics, .rs-nav-menu-product-search-news-channels {
padding-left: 0;
margin: 0;
}
@media (min-width: 1152px) {
.rs-nav-menu-dropdown__group, .rs-nav-menu-product-about__group, .rs-nav-menu-product-search__group {
padding-top: 15px;
padding-bottom: 15px;
border-width: 0 0 1px 0;
border-style: solid;
border-color: #ccc;
*zoom: 1;
}
.rs-nav-menu-dropdown__group:before, .rs-nav-menu-product-about__group:before, .rs-nav-menu-product-search__group:before, .rs-nav-menu-dropdown__group:after, .rs-nav-menu-product-about__group:after, .rs-nav-menu-product-search__group:after {
content: " ";
display: table;
}
.rs-nav-menu-dropdown__group:after, .rs-nav-menu-product-about__group:after, .rs-nav-menu-product-search__group:after {
clear: both;
}
}
.rs-nav-menu-dropdown__group:last-of-type, .rs-nav-menu-product-about__group:last-of-type, .rs-nav-menu-product-search__group:last-of-type {
border-bottom: none;
padding-bottom: 0;
}
.rs-nav-menu-dropdown__group--no-title, .rs-nav-menu-product-about__group--no-title {
padding-top: 0;
}
.rs-nav-menu-dropdown-list__item, .rs-nav-menu-product-about-journo__item, .rs-nav-menu-product-about-pr__item, .rs-nav-menu-product-search-channels__item {
margin-bottom: 10px;
}
.rs-nav-menu-dropdown-list__item:last-of-type, .rs-nav-menu-product-about-journo__item:last-of-type, .rs-nav-menu-product-about-pr__item:last-of-type, .rs-nav-menu-product-search-channels__item:last-of-type {
margin-bottom: 0;
}
.user__logout, .user__link, .services-rscompany-list__link {
display: block;
height: 50px;
padding-top: 12px;
padding-right: 22px;
padding-left: 22px;
font-family: "Mada", Arial, sans-serif;
font-size: 19px;
font-size: 1.9rem;
letter-spacing: -0.4px;
font-weight: 300;
text-decoration: none;
color: #333;
outline: 0;
}
.user__logout:hover, .user__link:hover, .services-rscompany-list__link:hover {
text-decoration: underline;
}
.services-rscompany__title, .services-jobs__title, .services-journo__title, .services-pr__title {
text-align: left;
font-family: "Mada", Arial, sans-serif;
font-size: 21px;
font-size: 2.1rem;
letter-spacing: -0.4px;
font-weight: 500;
color: #ff9f6f;
margin-bottom: 12px;
}
.services-jobs__group-title, .services-journo__group-title, .services-pr__group-title {
text-align: left;
font-family: "Mada", Arial, sans-serif;
font-size: 19px;
font-size: 1.9rem;
letter-spacing: -0.4px;
font-weight: 500;
margin-bottom: 6px;
color: #333;
}
.services-jobs__group, .services-journo__group, .services-pr__group {
margin-bottom: 24px;
}
body.noscroll {
width: 100%;
position: fixed;
overflow-y: scroll;
}
.rs-nav {
line-height: 1.231;
background-color: #e6e6e6;
height: 50px;
border-width: 0 0 1px 0;
border-style: solid;
border-color: #ccc;
}
.rs-nav--app {
height: 51px;
}
.rs-nav * {
box-sizing: border-box;
}
.rs-nav--large-margin {
margin-bottom: 50px;
}
@media (min-width: 1152px) {
.rs-nav__item {
height: 50px;
}
}
.rs-nav__item--menu {
width: 317px;
height: 100%;
position: fixed;
top: 0;
right: -317px;
background-color: white;
z-index: 1;
border-width: 0 0 0 1px;
border-style: solid;
border-color: #ccc;
-webkit-transition: all 0.1s linear;
-khtml-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-ms-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
transition: all 0.1s linear;
}
@media (min-width: 1152px) {
.rs-nav__item--menu {
width: auto;
height: auto;
position: static;
background-color: transparent;
border-width: 0 0 0 0;
border-style: solid;
border-color: #ccc;
float: right;
display: inline;
-webkit-transition: none;
-khtml-transition: none;
-moz-transition: none;
-ms-transition: none;
-o-transition: none;
transition: none;
}
}
.rs-nav__item.s-show {
right: -17px;
overflow-y: scroll;
}
.rs-nav__item--breadcrumbs {
width: auto;
float: left;
display: inline;
}
.rs-nav__item--trigger {
width: 50px;
height: 49px;
background: #fff;
padding: 8px;
float: right;
display: inline;
border-width: 0 0 0 1px;
border-style: solid;
border-color: #ccc;
}
.rs-nav__item--trigger:hover {
background-color: #f1f1f1;
}
@media (min-width: 1152px) {
.rs-nav__item--trigger {
display: none;
opacity: 0;
}
}
@media (min-width: 1152px) {
.rs-nav-menu-product {
float: left;
}
}
.rs-nav-menu-product__item {
-webkit-transition: none;
-khtml-transition: none;
-moz-transition: none;
-ms-transition: none;
-o-transition: none;
transition: none;
display: block;
}
.rs-nav-menu-product__item:first-child {
padding-top: 15px;
}
.rs-nav-menu-product__item.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.rs-nav-menu-product__item.not-desktop-feature {
display: none;
opacity: 0;
}
}
@media (min-width: 1152px) {
.rs-nav-menu-product__item {
position: relative;
float: left;
display: inline;
}
.rs-nav-menu-product__item:first-child {
padding-top: 0;
}
}
.rs-nav-menu-product__title {
display: block;
height: 50px;
text-decoration: none;
color: #333;
outline: 0;
cursor: pointer;
padding-top: 12px;
padding-right: 22px;
padding-left: 22px;
font-family: "Mada", Arial, sans-serif;
font-size: 19px;
font-size: 1.9rem;
letter-spacing: -0.4px;
font-weight: 400;
-webkit-transition: all 0.1s linear;
-khtml-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-ms-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
transition: all 0.1s linear;
}
.rs-nav-menu-product__title:hover {
text-decoration: underline;
}
@media (min-width: 1152px) {
.rs-nav-menu-product__title {
position: relative;
float: left;
display: inline;
padding-top: 14px;
padding-right: 10px;
padding-left: 10px;
}
.rs-nav-menu-product__title:hover {
text-decoration: none;
}
.rs-nav-menu-product__title:hover {
text-shadow: 0px 0px #666;
background-color: #f1f1f1;
height: 49px;
}
}
.rs-nav-menu-product__title.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.rs-nav-menu-product__title.not-mobile-feature {
display: block;
opacity: 1;
}
}
.rs-nav-menu-product__title.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.rs-nav-menu-product__title.not-desktop-feature {
display: none;
opacity: 0;
}
}
@media (min-width: 1152px) {
.rs-nav-menu-product__title.js-trigger-rs-nav {
padding-right: 0px;
}
.rs-nav-menu-product__title.open {
background: #ff9f6f;
color: #fff;
height: 50px;
}
.rs-nav-menu-product__title.open > svg {
fill: #ffffff;
}
}
.rs-nav-menu-product-search {
padding-right: 20px;
padding-left: 50px;
}
@media (min-width: 1152px) {
.rs-nav-menu-product-search {
position: absolute;
top: 60px;
right: -1px;
background: #fff;
border: 2px solid #9A9A9A;
padding-top: 20px;
padding-right: 30px;
padding-bottom: 20px;
padding-left: 30px;
}
}
@media (min-width: 1152px) {
.rs-nav-menu-product-search {
width: 700px;
}
}
.rs-nav-menu-product-search__group.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.rs-nav-menu-product-search__group.not-mobile-feature {
display: block;
opacity: 1;
}
}
.rs-nav-menu-product-search__group-title {
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: -0.4px;
font-weight: normal;
color: #333;
text-decoration: none;
margin-bottom: 15px;
}
.rs-nav-menu-product-search-channels {
margin: 0;
padding-left: 0;
}
@media (min-width: 1152px) {
.rs-nav-menu-product-search-channels__item {
float: left;
width: auto;
margin-right: 20px;
margin-bottom: 0;
}
}
.rs-nav-menu-product-search-channels__title {
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: -0.4px;
font-weight: normal;
color: #333;
text-decoration: none;
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: normal;
padding-top: 0;
padding-bottom: 6px;
color: #54a3d8;
display: block;
text-decoration: none;
}
@media (min-width: 1152px) {
.rs-nav-menu-product-search-channels__title {
display: inline;
}
}
.rs-nav-menu-product-search-channels__title:hover {
text-decoration: underline;
}
@media (min-width: 1152px) {
.rs-nav-menu-product-search-channels__title {
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: -0.4px;
font-weight: normal;
color: #333;
text-decoration: none;
}
}
.rs-nav-menu-product-about {
padding-right: 20px;
padding-left: 50px;
}
@media (min-width: 1152px) {
.rs-nav-menu-product-about {
position: absolute;
top: 60px;
right: -1px;
background: #fff;
border: 2px solid #9A9A9A;
padding-top: 20px;
padding-right: 30px;
padding-bottom: 20px;
padding-left: 30px;
}
}
@media (min-width: 1152px) {
.rs-nav-menu-product-about {
width: 300px;
}
}
.rs-nav-menu-product-about-pr {
padding-left: 0;
}
.rs-nav-menu-product-about-pr__link {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: normal;
padding-top: 0;
padding-bottom: 6px;
color: #54a3d8;
display: block;
text-decoration: none;
}
@media (min-width: 1152px) {
.rs-nav-menu-product-about-pr__link {
display: inline;
}
}
.rs-nav-menu-product-about-pr__link:hover {
text-decoration: underline;
}
@media (min-width: 1152px) {
.rs-nav-menu-product-about-pr__link {
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: -0.4px;
font-weight: normal;
color: #333;
text-decoration: none;
}
}
.rs-nav-menu-product-about-journo {
padding-left: 0;
}
.rs-nav-menu-product-about-journo__link {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: normal;
padding-top: 0;
padding-bottom: 6px;
color: #54a3d8;
display: block;
text-decoration: none;
}
@media (min-width: 1152px) {
.rs-nav-menu-product-about-journo__link {
display: inline;
}
}
.rs-nav-menu-product-about-journo__link:hover {
text-decoration: underline;
}
@media (min-width: 1152px) {
.rs-nav-menu-product-about-journo__link {
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: -0.4px;
font-weight: normal;
color: #333;
text-decoration: none;
}
}
.rs-nav-menu-utils {
padding-top: 15px;
border-width: 1px 0 0 0;
border-style: solid;
border-color: #ccc;
}
@media (min-width: 1152px) {
.rs-nav-menu-utils {
padding-top: 0;
margin-top: 0;
float: left;
height: 49px;
background: #fff;
border-width: 0 0 0 0;
border-style: solid;
border-color: #ccc;
}
}
.rs-nav-menu-utils__item {
display: block;
}
@media (min-width: 1152px) {
.rs-nav-menu-utils__item {
position: relative;
float: left;
display: inline;
border-width: 0 0 0 1px;
border-style: solid;
border-color: #ccc;
}
}
.rs-nav-menu-utils__title {
display: block;
height: 50px;
text-decoration: none;
color: #333;
outline: 0;
cursor: pointer;
padding-top: 12px;
padding-right: 22px;
padding-left: 22px;
font-family: "Mada", Arial, sans-serif;
font-size: 19px;
font-size: 1.9rem;
letter-spacing: -0.4px;
font-weight: 400;
-webkit-transition: all 0.1s linear;
-khtml-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-ms-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
transition: all 0.1s linear;
}
.rs-nav-menu-utils__title:hover {
text-decoration: underline;
}
@media (min-width: 1152px) {
.rs-nav-menu-utils__title {
position: relative;
float: left;
display: inline;
padding-top: 14px;
padding-right: 10px;
padding-left: 10px;
}
.rs-nav-menu-utils__title:hover {
text-decoration: none;
}
.rs-nav-menu-utils__title:hover {
text-shadow: 0px 0px #666;
background-color: #f1f1f1;
height: 49px;
}
}
.rs-nav-menu-utils__title.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.rs-nav-menu-utils__title.not-mobile-feature {
display: block;
opacity: 1;
}
}
.rs-nav-menu-utils__title.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.rs-nav-menu-utils__title.not-desktop-feature {
display: none;
opacity: 0;
}
}
.rs-nav-menu-utils__title--services.not-mobile-feature, .rs-nav-menu-utils__title--settings.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.rs-nav-menu-utils__title--services.not-mobile-feature, .rs-nav-menu-utils__title--settings.not-mobile-feature {
display: block;
opacity: 1;
}
}
.rs-nav-menu-utils__title--back-link {
color: #ff5892;
}
.rs-nav-menu-utils__title.open {
background: #ff9f6f;
color: #fff;
height: 50px;
}
.rs-nav-menu-utils__title.open > svg {
fill: #ffffff;
}
@media (min-width: 1152px) {
.rs-nav-menu-utils-services {
width: 600px;
padding-left: 20px;
z-index: 1;
}
}
@media (min-width: 1152px) and (min-width: 1152px) {
.rs-nav-menu-utils-services {
position: absolute;
top: 60px;
right: -1px;
background: #fff;
border: 2px solid #9A9A9A;
padding-top: 20px;
padding-right: 30px;
padding-bottom: 20px;
padding-left: 30px;
}
}
@media (min-width: 1152px) {
.rs-nav-menu-utils-services.pr-only {
width: 350px;
}
}
@media (min-width: 1152px) {
.rs-nav-menu-utils-services.journ-only {
width: 350px;
}
}
@media (min-width: 1152px) {
.rs-nav-menu-utils-settings {
width: 350px;
padding-left: 20px;
right: 0;
}
}
@media (min-width: 1152px) and (min-width: 1152px) {
.rs-nav-menu-utils-settings {
position: absolute;
top: 60px;
right: -1px;
right: 0px;
background: #fff;
border: 2px solid #9A9A9A;
padding-top: 20px;
padding-right: 30px;
padding-bottom: 20px;
padding-left: 30px;
}
}
.rs-nav-menu-user {
background-color: #e6e6e6;
*zoom: 1;
padding-top: 12px;
padding-right: 22px;
padding-bottom: 12px;
padding-left: 22px;
}
.rs-nav-menu-user:before, .rs-nav-menu-user:after {
content: " ";
display: table;
}
.rs-nav-menu-user:after {
clear: both;
}
.rs-nav-menu-user.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.rs-nav-menu-user.not-desktop-feature {
display: none;
opacity: 0;
}
}
.rs-nav-breadcrumb {
float: left;
height: 49px;
width: auto;
}
.rs-nav-breadcrumb__title {
display: block;
height: 50px;
text-decoration: none;
color: #333;
outline: 0;
cursor: pointer;
padding-top: 12px;
padding-right: 22px;
padding-left: 22px;
font-family: "Mada", Arial, sans-serif;
font-size: 19px;
font-size: 1.9rem;
letter-spacing: -0.4px;
font-weight: 400;
-webkit-transition: all 0.1s linear;
-khtml-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-ms-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
transition: all 0.1s linear;
padding-top: 14px;
padding-right: 10px;
padding-left: 10px;
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
letter-spacing: -0.4px;
font-weight: normal;
}
.rs-nav-breadcrumb__title:hover {
text-decoration: underline;
}
@media (min-width: 1152px) {
.rs-nav-breadcrumb__title {
position: relative;
float: left;
display: inline;
padding-top: 14px;
padding-right: 10px;
padding-left: 10px;
}
.rs-nav-breadcrumb__title:hover {
text-decoration: none;
}
}
.rs-nav-breadcrumb__title.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.rs-nav-breadcrumb__title.not-mobile-feature {
display: block;
opacity: 1;
}
}
.rs-nav-breadcrumb__title.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.rs-nav-breadcrumb__title.not-desktop-feature {
display: none;
opacity: 0;
}
}
.rs-nav-breadcrumb--company {
border-width: 0 1px 0 0;
border-style: solid;
border-color: #ccc;
background: #fff;
}
@media (max-width: 61.24em) {
.rs-nav-breadcrumb--my-acc {
display: none;
}
}
.rs-item__services {
width: 600px;
left: -600px;
border: 2px solid #9A9A9A;
}
.rs-nav-menu-dropdown {
padding-right: 20px;
padding-left: 50px;
}
@media (min-width: 1152px) {
.rs-nav-menu-dropdown {
position: absolute;
top: 60px;
right: -1px;
background: #fff;
border: 2px solid #9A9A9A;
padding-top: 20px;
padding-right: 30px;
padding-bottom: 20px;
padding-left: 30px;
}
}
@media (min-width: 1152px) {
.rs-nav-menu-dropdown {
width: 300px;
}
.rs-nav-menu-dropdown--width-400 {
width: 400px;
}
.rs-nav-menu-dropdown--width-500 {
width: 500px;
}
}
.rs-nav-menu-dropdown-list {
padding-left: 0;
}
.rs-nav-menu-dropdown-list__link {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: normal;
padding-top: 0;
padding-bottom: 6px;
color: #54a3d8;
display: block;
text-decoration: none;
}
@media (min-width: 1152px) {
.rs-nav-menu-dropdown-list__link {
display: inline;
}
}
.rs-nav-menu-dropdown-list__link:hover {
text-decoration: underline;
}
@media (min-width: 1152px) {
.rs-nav-menu-dropdown-list__link {
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: -0.4px;
font-weight: normal;
color: #333;
text-decoration: none;
}
}
.services-pr {
display: none;
opacity: 0;
padding-right: 22px;
padding-left: 22px;
}
.services-pr.s-show {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.services-pr {
display: block;
opacity: 1;
padding-right: 0;
padding-left: 0;
}
}
@media (min-width: 1152px) {
.services-pr {
float: left;
display: inline;
width: 50%;
}
}
.services-pr--single-col {
float: none;
width: 100%;
}
.services-pr.pr-only {
float: none;
width: 100%;
}
.services-pr.journ-only {
display: none;
}
.services-pr__title {
margin-right: 10px;
}
.services-pr__title.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.services-pr__title.not-mobile-feature {
display: block;
opacity: 1;
}
}
.services-pr-list {
margin-left: 0;
padding-left: 0;
}
.services-pr-list__item {
padding-top: 0px;
padding-bottom: 0px;
list-style-type: none;
text-align: left;
}
@media (min-width: 1152px) {
.services-pr-list__item {
margin-bottom: 6px;
}
}
.services-pr-list__link {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: normal;
padding-top: 0;
padding-bottom: 6px;
color: #54a3d8;
display: block;
text-decoration: none;
}
@media (min-width: 1152px) {
.services-pr-list__link {
display: inline;
}
}
.services-pr-list__link:hover {
text-decoration: underline;
}
.services-journo {
display: none;
opacity: 0;
padding-right: 22px;
padding-left: 22px;
}
.services-journo.s-show {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.services-journo {
display: block;
opacity: 1;
padding-right: 0;
padding-left: 0;
}
}
@media (min-width: 1152px) {
.services-journo {
float: right;
display: inline;
width: webkit-calc(50% - 40px);
width: -moz-calc(50% - 40px);
width: calc(50% - 40px);
padding-left: 40px;
}
}
.services-journo__title.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.services-journo__title.not-mobile-feature {
display: block;
opacity: 1;
}
}
.services-journo.pr-only {
display: none;
}
.services-journo.journ-only {
float: none;
width: 100%;
padding-left: 0;
}
.services-journo-list {
margin-left: 0;
padding-left: 0;
}
.services-journo-list__item {
padding-top: 0px;
padding-bottom: 0px;
list-style-type: none;
text-align: left;
}
@media (min-width: 1152px) {
.services-journo-list__item {
margin-bottom: 6px;
}
}
.services-journo-list__link {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: normal;
padding-top: 0;
padding-bottom: 6px;
color: #54a3d8;
display: block;
text-decoration: none;
}
@media (min-width: 1152px) {
.services-journo-list__link {
display: inline;
}
}
.services-journo-list__link:hover {
text-decoration: underline;
}
.services-jobs {
display: none;
opacity: 0;
padding-right: 22px;
padding-left: 22px;
}
.services-jobs.s-show {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.services-jobs {
display: block;
opacity: 1;
padding-right: 0;
padding-left: 0;
}
}
@media (min-width: 1152px) {
.services-jobs {
float: right;
display: inline;
width: webkit-calc(50% - 40px);
width: -moz-calc(50% - 40px);
width: calc(50% - 40px);
padding-left: 40px;
}
}
.services-jobs__title.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.services-jobs__title.not-mobile-feature {
display: block;
opacity: 1;
}
}
.services-jobs.pr-only {
width: 100%;
float: none;
padding-left: 0;
}
.services-jobs.journ-only {
width: 100%;
float: none;
padding-left: 0;
}
.services-jobs-list {
padding-left: 0;
margin-left: 0;
}
.services-jobs-list__item {
padding-top: 0px;
padding-bottom: 0px;
list-style-type: none;
text-align: left;
}
@media (min-width: 1152px) {
.services-jobs-list__item {
margin-bottom: 6px;
}
}
.services-jobs-list__link {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: normal;
padding-top: 0;
padding-bottom: 6px;
color: #54a3d8;
display: block;
text-decoration: none;
}
@media (min-width: 1152px) {
.services-jobs-list__link {
display: inline;
}
}
.services-jobs-list__link:hover {
text-decoration: underline;
}
.services-rscompany {
width: 100%;
clear: both;
}
@media (min-width: 1152px) {
.services-rscompany {
padding-right: 22px;
border-width: 1px 0 0 0;
border-style: solid;
border-color: #ccc;
}
}
.services-rscompany__title {
margin-top: 15px;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
.services-rscompany__title.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.services-rscompany__title.not-mobile-feature {
display: block;
opacity: 1;
}
}
.services-rscompany-list {
padding: 0;
margin: 0;
*zoom: 1;
}
.services-rscompany-list:before, .services-rscompany-list:after {
content: " ";
display: table;
}
.services-rscompany-list:after {
clear: both;
}
@media (min-width: 1152px) {
.services-rscompany-list {
padding-top: 15px;
}
}
.services-rscompany-list__item {
padding-top: 0px;
padding-bottom: 0px;
list-style-type: none;
text-align: left;
}
@media (min-width: 1152px) {
.services-rscompany-list__item {
margin-bottom: 6px;
}
}
@media (min-width: 1152px) {
.services-rscompany-list__item {
width: 50%;
float: left;
display: inline;
}
}
@media (min-width: 1152px) {
.services-rscompany-list__link {
height: auto;
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: normal;
padding-top: 15px;
color: #54a3d8;
text-decoration: none;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
}
.services-rscompany-list__link:hover {
text-decoration: underline;
}
}
.services-rscompany-list.journ-only .services-rscompany-list__item {
width: 100%;
float: none;
display: block;
}
.services-rscompany-list.pr-only .services-rscompany-list__item {
width: 100%;
float: none;
display: block;
}
.services-pr-trigger, .services-journo-trigger, .services-jobs-trigger {
display: block;
height: 50px;
text-decoration: none;
color: #333;
outline: 0;
cursor: pointer;
padding-top: 12px;
padding-right: 22px;
padding-left: 22px;
font-family: "Mada", Arial, sans-serif;
font-size: 19px;
font-size: 1.9rem;
letter-spacing: -0.4px;
font-weight: 400;
-webkit-transition: all 0.1s linear;
-khtml-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-ms-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
transition: all 0.1s linear;
cursor: pointer;
}
.services-pr-trigger:hover, .services-journo-trigger:hover, .services-jobs-trigger:hover {
text-decoration: underline;
}
@media (min-width: 1152px) {
.services-pr-trigger, .services-journo-trigger, .services-jobs-trigger {
position: relative;
float: left;
display: inline;
padding-top: 14px;
padding-right: 10px;
padding-left: 10px;
}
.services-pr-trigger:hover, .services-journo-trigger:hover, .services-jobs-trigger:hover {
text-decoration: none;
}
.services-pr-trigger:hover, .services-journo-trigger:hover, .services-jobs-trigger:hover {
text-shadow: 0px 0px #666;
background-color: #f1f1f1;
height: 49px;
}
}
.services-pr-trigger.not-mobile-feature, .services-journo-trigger.not-mobile-feature, .services-jobs-trigger.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.services-pr-trigger.not-mobile-feature, .services-journo-trigger.not-mobile-feature, .services-jobs-trigger.not-mobile-feature {
display: block;
opacity: 1;
}
}
.services-pr-trigger.not-desktop-feature, .services-journo-trigger.not-desktop-feature, .services-jobs-trigger.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.services-pr-trigger.not-desktop-feature, .services-journo-trigger.not-desktop-feature, .services-jobs-trigger.not-desktop-feature {
display: none;
opacity: 0;
}
}
@media (min-width: 1152px) {
.services-pr-trigger, .services-journo-trigger, .services-jobs-trigger {
display: none;
opacity: 0;
}
}
.user {
text-decoration: none;
color: #333;
outline: 0;
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
letter-spacing: -0.4px;
font-weight: 300;
}
@media (min-width: 1152px) {
.user__group {
padding-bottom: 15px;
border-width: 0 0 1px 0;
border-style: solid;
border-color: #ccc;
}
}
.user__avater {
width: 48px;
background-color: white;
float: left;
display: inline;
*zoom: 1;
margin-right: 10px;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #ccc;
}
.user__avater:before, .user__avater:after {
content: " ";
display: table;
}
.user__avater:after {
clear: both;
}
@media (min-width: 1152px) {
.user__avater {
border: none;
}
}
.user__name {
font-family: "Mada", Arial, sans-serif;
font-size: 23px;
font-size: 2.3rem;
letter-spacing: -0.4px;
font-weight: 500;
}
.user__company {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: normal;
}
@media (min-width: 1152px) {
.user__company {
color: #666;
}
}
.user__avater.not-mobile-feature, .user__name.not-mobile-feature, .user__company.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.user__avater.not-mobile-feature, .user__name.not-mobile-feature, .user__company.not-mobile-feature {
display: block;
opacity: 1;
}
}
.user__link {
display: block;
padding-left: 0;
padding-right: 0;
padding-top: 0;
}
.user__link.not-mobile-feature {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.user__link.not-mobile-feature {
display: block;
opacity: 1;
}
}
@media (min-width: 1152px) {
.user__link {
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: -0.4px;
font-weight: normal;
color: #333;
text-decoration: none;
margin-bottom: 12px;
height: auto;
}
.user__link:first-of-type {
margin-top: 12px;
}
.user__link:last-of-type {
margin-bottom: 0;
}
}
@media (min-width: 1152px) {
.user__logout {
text-align: right;
color: #333;
border-width: 1px 0 0 0;
border-style: solid;
border-color: #ccc;
padding-top: 15px;
padding-right: 0;
padding-left: 0;
margin-top: 10px;
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: -0.4px;
font-weight: 300;
}
}
.user__utilities {
border-width: 1px 0 0 0;
border-style: solid;
border-color: #ccc;
padding-top: 0;
padding-right: 0;
padding-bottom: 10px;
padding-left: 0;
}
.js-dropdown-rs-nav {
z-index: 1;
display: none;
opacity: 0;
}
.js-dropdown-rs-nav--mobile-show {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.js-dropdown-rs-nav--mobile-show {
display: none;
opacity: 0;
}
}
.js-dropdown-rs-nav--desktop-show {
display: none;
opacity: 0;
}
@media (min-width: 1152px) {
.js-dropdown-rs-nav--desktop-show {
display: block;
opacity: 1;
}
}
.js-dropdown-rs-nav.open {
display: block;
opacity: 1;
}
/* for the logged in account dropdown links */
.c-user-acc-card {
color: #292f33;
padding: 10px 24px 10px 24px;
}
@media (min-width: 1152px) {
.c-user-acc-card {
padding: 0;
}
}
.c-user-acc-card__header {
color: #333;
text-align: left;
}
@media (min-width: 1152px) {
.c-user-acc-card__header {
padding: 0;
}
}
.c-user-acc-card__user {
margin-bottom: 8px;
font-family: "Mada", Arial, sans-serif;
font-size: 24px;
font-size: 2.4rem;
letter-spacing: -0.4px;
font-weight: 400;
}
.c-user-acc-card__company {
padding-bottom: 10px;
margin: 0 0 0 0;
font-family: "Mada", Arial, sans-serif;
font-size: 15px;
font-size: 1.5rem;
letter-spacing: -0.4px;
font-weight: 400;
color: #999;
}
.c-user-acc-card__links {
border-width: 1px 0 1px 0;
border-style: solid;
border-color: #ccc;
padding: 12px 0;
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: -0.4px;
font-weight: 300;
}
@media (min-width: 1152px) {
.c-user-acc-card__links {
margin: 0 0 18px 0;
}
}
.c-user-acc-card__links-item {
margin-bottom: 10px;
color: #292f33;
}
.c-user-acc-card__links-item:last-of-type {
margin-bottom: 0;
}
.c-user-acc-card__meta {
float: left;
width: webkit-calc(100% - 80px);
width: -moz-calc(100% - 80px);
width: calc(100% - 80px);
}
.c-user-acc-card__avatar {
float: right;
margin-bottom: 8px;
}
/* for the logged in account dropdown links */
.acc_header {
color: #333;
text-align: left;
margin: 24px;
}
/* ===== APP SWITCH =========================================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-component for universal cross site service switch
+------+ +------+ +------+
| | | | | |
+------+ +------+ +------+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* dropdown width config */
/* main tile generator */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-app-tile {
position: relative;
padding: 140px 24px 48px 24px;
background-repeat: no-repeat;
background-position: center 48px;
background-size: 70px;
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
line-height: 1.3;
font-weight: 700;
text-align: center;
color: #fff;
}
.c-app-tile--MCD, .c-app-tile--25096 {
background-color: #ff5892;
background-image: url("svg/ico/app-tile/ico-app-database.svg");
}
.c-app-tile--MCD:hover, .c-app-tile--25096:hover {
background-color: #ff397e;
text-decoration: none;
}
.c-app-tile--MCD-folders, .c-app-tile--25096-folders {
padding-top: 85px;
padding-bottom: 24px;
background-color: #FFF;
background-position: center 24px;
border: 3px solid #ff5892;
background-size: 44px;
font-size: 16px;
font-size: 1.6rem;
color: #666;
background-image: url(svg/ico/app-tile/ico-app-database-folders.svg);
background-position: center 28px;
}
.c-app-tile--MCD-folders:hover, .c-app-tile--25096-folders:hover {
background-color: #ff5892;
color: #fff;
text-decoration: none;
}
.c-app-tile--MCD-folders:hover, .c-app-tile--25096-folders:hover {
background-image: url(svg/ico/app-tile/ico-app-database-folders-hvr-2.svg);
}
.c-app-tile--VMD {
background-color: #264592;
background-image: url("svg/ico/app-tile/ico-app-database.svg");
}
.c-app-tile--VMD:hover {
background-color: #203a7a;
text-decoration: none;
}
.c-app-tile--VMD-folders {
padding-top: 85px;
padding-bottom: 24px;
background-color: #FFF;
background-position: center 24px;
border: 3px solid #264592;
background-size: 44px;
font-size: 16px;
font-size: 1.6rem;
color: #666;
background-image: url(svg/ico/app-tile/ico-app-database-folders.svg);
background-position: center 28px;
}
.c-app-tile--VMD-folders:hover {
background-color: #264592;
color: #fff;
text-decoration: none;
}
.c-app-tile--VMD-folders:hover {
background-image: url(svg/ico/app-tile/ico-app-database-folders-hvr-2.svg);
}
.c-app-tile--JES, .c-app-tile--25097, .c-app-tile--35 {
background-color: #54a3d8;
background-image: url("svg/ico/app-tile/ico-app-enquiries.svg");
}
.c-app-tile--JES:hover, .c-app-tile--25097:hover, .c-app-tile--35:hover {
background-color: #3b96d2;
text-decoration: none;
}
.c-app-tile--JES-settings, .c-app-tile--25097-settings, .c-app-tile--35-settings {
padding-top: 85px;
padding-bottom: 24px;
background-color: #FFF;
background-position: center 24px;
border: 3px solid #54a3d8;
background-size: 44px;
font-size: 16px;
font-size: 1.6rem;
color: #666;
background-image: url(svg/ico/app-tile/ico-app-enquiries-settings.svg);
}
.c-app-tile--JES-settings:hover, .c-app-tile--25097-settings:hover, .c-app-tile--35-settings:hover {
background-color: #54a3d8;
color: #fff;
text-decoration: none;
}
.c-app-tile--JES-settings:hover, .c-app-tile--25097-settings:hover, .c-app-tile--35-settings:hover {
background-image: url(svg/ico/app-tile/ico-app-enquiries-settings-hvr-2.svg);
}
.c-app-tile--JES-my-enqs, .c-app-tile--25097-my-enqs, .c-app-tile--35-my-enqs {
padding-top: 85px;
padding-bottom: 24px;
background-color: #FFF;
background-position: center 24px;
border: 3px solid #54a3d8;
background-size: 44px;
font-size: 16px;
font-size: 1.6rem;
color: #666;
background-image: url(svg/ico/app-tile/ico-app-my-rels.svg);
}
.c-app-tile--JES-my-enqs:hover, .c-app-tile--25097-my-enqs:hover, .c-app-tile--35-my-enqs:hover {
background-color: #54a3d8;
color: #fff;
text-decoration: none;
}
.c-app-tile--JES-my-enqs:hover, .c-app-tile--25097-my-enqs:hover, .c-app-tile--35-my-enqs:hover {
background-image: url(svg/ico/app-tile/ico-app-my-rels-hvr.svg);
}
.c-app-tile--PRW, .c-app-tile--24969, .c-app-tile--39 {
background-color: #666;
background-image: url("svg/ico/app-tile/ico-app-releases.svg");
}
.c-app-tile--PRW:hover, .c-app-tile--24969:hover, .c-app-tile--39:hover {
background-color: #575757;
text-decoration: none;
}
.c-app-tile--PRW-settings, .c-app-tile--24969-settings, .c-app-tile--39-settings {
padding-top: 85px;
padding-bottom: 24px;
background-color: #FFF;
background-position: center 24px;
border: 3px solid #666;
background-size: 44px;
font-size: 16px;
font-size: 1.6rem;
color: #666;
background-image: url(svg/ico/app-tile/ico-app-releases-settings.svg);
}
.c-app-tile--PRW-settings:hover, .c-app-tile--24969-settings:hover, .c-app-tile--39-settings:hover {
background-color: #666;
color: #fff;
text-decoration: none;
}
.c-app-tile--PRW-settings:hover, .c-app-tile--24969-settings:hover, .c-app-tile--39-settings:hover {
background-image: url(svg/ico/app-tile/ico-app-releases-settings-hvr-2.svg);
}
.c-app-tile--PRW-receive-settings, .c-app-tile--24969-receive-settings, .c-app-tile--39-receive-settings {
padding-top: 85px;
padding-bottom: 24px;
background-color: #FFF;
background-position: center 24px;
border: 3px solid #666;
background-size: 44px;
font-size: 16px;
font-size: 1.6rem;
color: #666;
background-image: url(svg/ico/app-tile/ico-app-receive-settings.svg);
}
.c-app-tile--PRW-receive-settings:hover, .c-app-tile--24969-receive-settings:hover, .c-app-tile--39-receive-settings:hover {
background-color: #666;
color: #fff;
text-decoration: none;
}
.c-app-tile--PRW-receive-settings:hover, .c-app-tile--24969-receive-settings:hover, .c-app-tile--39-receive-settings:hover {
background-image: url(svg/ico/app-tile/ico-app-enquiries-settings-hvr-2.svg);
}
.c-app-tile--RS {
padding-top: 85px;
padding-bottom: 24px;
background-color: #FFF;
background-position: center 24px;
border: 3px solid #ff9f6f;
background-size: 44px;
font-size: 16px;
font-size: 1.6rem;
color: #666;
padding: 24px;
}
.c-app-tile--RS:hover {
background-color: #ff9f6f;
color: #fff;
text-decoration: none;
}
.c-app-tile--FJP {
background-color: #54a3d8;
background-image: url("svg/ico/app-tile/ico-app-fjp-profile.svg");
}
.c-app-tile--FJP:hover {
background-color: #3b96d2;
text-decoration: none;
}
.c-app-tile--FJP-view-profile {
padding-top: 85px;
padding-bottom: 24px;
background-color: #FFF;
background-position: center 24px;
border: 3px solid #54a3d8;
background-size: 44px;
font-size: 16px;
font-size: 1.6rem;
color: #666;
background-image: url(svg/ico/app-tile/ico-app-fjp-view-profile.svg);
background-size: 55px;
background-position: center 16px;
}
.c-app-tile--FJP-view-profile:hover {
background-color: #54a3d8;
color: #fff;
text-decoration: none;
}
.c-app-tile--FJP-view-profile:hover {
background-image: url(svg/ico/app-tile/ico-app-fjp-view-profile-hvr.svg);
}
.c-app-tile--LIVE-CHAT {
padding-top: 85px;
padding-bottom: 24px;
background-color: #FFF;
background-position: center 24px;
border: 3px solid #666;
background-size: 44px;
font-size: 16px;
font-size: 1.6rem;
color: #666;
background-image: url(svg/ico/app-tile/ico-app-live-chat.svg);
background-position: 24px center;
padding: 24px;
padding-top: 40px;
padding-left: 80px;
text-align: left;
}
.c-app-tile--LIVE-CHAT:hover {
background-color: #666;
color: #fff;
text-decoration: none;
}
@media (max-width: 34.365em) {
.c-app-tile--LIVE-CHAT {
background-position: center center;
}
}
.c-app-tile--sub {
padding-top: 85px;
padding-bottom: 24px;
background-color: #FFF;
background-position: center 24px;
border: 3px solid #e6e6e6;
background-size: 44px;
font-size: 16px;
font-size: 1.6rem;
color: #666;
padding-top: 24px;
}
.c-app-tile--sub:hover {
background-color: #e6e6e6;
color: #fff;
text-decoration: none;
}
.c-app-tile--sub-magenta {
padding: 24px;
background-color: #FFF;
border: 3px solid #ff5892;
font-size: 16px;
font-size: 1.6rem;
color: #ff5892;
}
.c-app-tile--sub-magenta:hover {
background-color: #f7f7f7;
color: #fff;
text-decoration: none;
border-color: #ff397e;
}
.c-app-tile--sub-VMD {
padding: 24px;
background-color: #FFF;
border: 3px solid #264592;
font-size: 16px;
font-size: 1.6rem;
color: #264592;
}
.c-app-tile--sub-VMD:hover {
background-color: #f7f7f7;
color: #fff;
text-decoration: none;
border-color: #203a7a;
}
.c-app-tile--sub-blue {
padding: 24px;
background-color: #FFF;
border: 3px solid #54a3d8;
font-size: 16px;
font-size: 1.6rem;
color: #54a3d8;
}
.c-app-tile--sub-blue:hover {
background-color: #f7f7f7;
color: #fff;
text-decoration: none;
border-color: #3b96d2;
}
.c-app-tile--sub-grey {
padding: 24px;
background-color: #FFF;
border: 3px solid #666;
font-size: 16px;
font-size: 1.6rem;
color: #666;
}
.c-app-tile--sub-grey:hover {
background-color: #f7f7f7;
color: #fff;
text-decoration: none;
border-color: #575757;
}
.c-app-tile--sub-fill-magenta {
padding: 24px;
background-color: #ff5892;
font-size: 16px;
font-size: 1.6rem;
color: #fff;
}
.c-app-tile--sub-fill-magenta:hover {
background-color: #ff397e;
}
.c-app-tile--sub-fill-blue {
padding: 24px;
background-color: #54a3d8;
font-size: 16px;
font-size: 1.6rem;
color: #fff;
}
.c-app-tile--sub-fill-blue:hover {
background-color: #3b96d2;
}
.c-app-tile--sub-fill-grey {
padding: 24px;
background-color: #666;
font-size: 16px;
font-size: 1.6rem;
color: #fff;
}
.c-app-tile--sub-fill-grey:hover {
background-color: #575757;
}
.c-app-tile__lock {
width: 100px;
height: 100px;
position: absolute;
right: 0;
top: 0;
background-image: url(svg/ico/app-tile/ico-tile-padlock.svg);
background-size: 100px;
}
/* ===== SECONDARY NAVIGATION COMPONENT =====================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-component for universal cross site service navigaiton
+-------------------------------+
| ~ | ~ | ~ | ~ | | ~ |
+-------------------------------+
*/
/* ======================================================================
core styling ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* mainbar style */
.c-nav-second {
height: 55px;
border-bottom: 2px solid #D8D8D8;
position: relative;
/* no order option at different widths */
/* if you want the nav to be expandable */
}
.c-nav-second--rs-brand {
background-color: #1067b0;
z-index: 10;
box-shadow: 0 4px 6px -4px rgba(0, 0, 0, 0.5);
border-bottom-width: 0;
}
.c-nav-second--rs-brand .c-nav-second__title {
border-right-width: 0;
color: #FFF;
}
.c-nav-second--vuelio-brand {
background-color: #264592;
}
.c-nav-second--rs-brand .c-nav-second__title, .c-nav-second--vuelio-brand .c-nav-second__title {
font-size: 1.8rem;
}
.c-nav-second--ai-shadow {
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}
@media (min-width: 34.375em) {
.c-nav-second--no-border\@mobile {
border-bottom: none;
}
}
@media (min-width: 46.25em) {
.c-nav-second--no-border\@tablet {
border-bottom: none;
}
}
@media (min-width: 52.5em) {
.c-nav-second--no-border\@medium {
border-bottom: none;
}
}
@media (min-width: 61.25em) {
.c-nav-second--no-border\@desktop {
border-bottom: none;
}
}
@media (min-width: 64em) {
.c-nav-second--no-border\@desktop-medium {
border-bottom: none;
}
}
@media (min-width: 71.875em) {
.c-nav-second--no-border\@desktop-wide {
border-bottom: none;
}
}
@media (min-width: 81.25em) {
.c-nav-second--no-border\@wide {
border-bottom: none;
}
}
.c-nav-second--h-auto {
min-height: 55px;
height: auto;
}
.c-nav-second--w-border {
border-bottom: 2px solid #D8D8D8;
}
/* parent button */
.c-nav-second__btn {
float: left;
font-size: 1.6rem;
font-weight: 700;
color: #585858;
}
/* level container if the nav is expandable and needs a line */
.c-nav-second__row {
height: 55px;
}
/* nav link */
.c-nav-second__btn-link {
/* base style */
display: block;
height: 55px;
padding: 20px 24px 12px 24px;
padding: 18px 24px 12px 24px;
color: #4A4A4A;
cursor: pointer;
/* alter font and padding until wide width */
/* hover state */
}
@media (max-width: 81.24em) {
.c-nav-second__btn-link {
font-size: 15px;
font-size: 1.5rem;
padding: 21px 12px 12px 12px;
}
}
.c-nav-second__btn-link:hover {
border-bottom: 3px solid #54a3d8;
background-color: #fcfcfc;
text-decoration: none;
}
.c-nav-second__btn-link.s-active {
border-bottom: 3px solid #54a3d8;
background-color: #fcfcfc;
text-decoration: none;
}
.c-nav-second__rs-link {
display: block;
height: 55px;
padding: 20px 24px 12px 24px;
padding: 18px 24px 12px 24px;
color: #FFF;
cursor: pointer;
}
.c-nav-second__rs-link:hover {
border-bottom: 3px solid #54a3d8;
background-color: #1975b9;
text-decoration: none;
}
.c-nav-second__rs-link.s-active {
border-bottom: 3px solid #54a3d8;
background-color: #1975b9;
text-decoration: none;
}
.c-nav-second__vuelio-link:hover {
border-bottom: 3px solid #54a3d8;
background-color: #3557A0;
text-decoration: none;
}
/* icon modifyers */
.c-nav-second__btn-link--ico {
padding-left: 40px;
background-repeat: no-repeat;
background-position: 16px 24px;
background-position: 16px 22px;
background-size: 16px;
min-height: 16px;
/* dropdown arrow - reverse on active */
/* search mag glass */
}
.c-nav-second__btn-link--ico-dropdown {
background-image: url(svg/ico/ico-menu-drop-dark.svg);
}
.c-nav-second__btn-link--ico-dropdown.s-active {
background-image: url(svg/ico/ico-menu-drop-dark--up.svg);
}
.c-nav-second__btn-link--ico-search {
background-image: url(svg/ico/ico-nav-search-dark.svg);
background-position: 16px 20px;
background-size: 17px;
}
.c-nav-second__btn-link--ico-search-white {
background-image: url(svg/ico/ai-app/search--white.svg);
}
.c-nav-second--rs-brand .c-nav-second__btn-link--ico-dropdown {
background-image: url(svg/ico/ico-menu-arrow-down--white.svg);
}
.c-nav-second--rs-brand .c-nav-second__btn-link--ico-dropdown.s-active {
background-image: url(svg/ico/ico-menu-arrow-up--white.svg);
}
.c-nav-second__rs-link--ico {
padding-right: 46px;
background-repeat: no-repeat;
background-position: top 18px right 24px;
background-size: 22px;
min-height: 22px;
/* dropdown arrow - reverse on active */
/* search mag glass */
}
.c-nav-second__rs-link--ico-down {
background-image: url(svg/ico/ai-app/down.svg);
}
.c-nav-second__rs-link--ico-search {
background-image: url(svg/ico/ai-app/search--white.svg);
}
/* active state */
.c-nav-second__btn--active > .c-nav-second__btn-link {
background-color: #f7f7f7;
border-bottom: 3px solid #ff5892;
height: 55px;
}
.c-nav-second__btn--active > .c-nav-second__rs-link {
border-bottom: 3px solid #54a3d8;
background-color: #fcfcfc;
text-decoration: none;
}
.c-nav-second--rs-brand .c-nav-second__btn--active > .c-nav-second__rs-link {
border-bottom: 3px solid #54a3d8;
background-color: #1975b9;
text-decoration: none;
}
.c-nav-second--vuelio-brand .c-nav-second__btn--active > .c-nav-second__vuelio-link {
border-bottom: 3px solid #54a3d8;
background-color: #3557A0;
text-decoration: none;
}
/* non link level title */
.c-nav-second__title {
height: 53px;
padding: 20px 24px 12px 24px;
color: #333;
font-weight: 700;
border-right: 2px solid #D8D8D8;
}
.c-nav-second__title--mobile {
font-size: 22px;
font-size: 2.2rem;
padding-top: 17px;
}
.c-nav-second__title--no-border {
border-right-width: 0;
}
.c-nav-second__title > a {
color: #333;
}
/* ======================================================================
Theme options ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* light theme ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* main bar */
.t-light.c-nav-second {
background-color: #d9d9d9;
border-bottom: none;
}
/* button style */
.t-light .c-nav-second__btn-link {
color: #333;
}
.t-light .c-nav-second__btn-link:hover {
height: 55px;
border-bottom: 3px solid #54a3d8;
background-color: #c7c7c7;
}
.t-light .c-nav-second__btn--active > .c-nav-second__btn-link {
background-color: #cacaca;
}
/* title style */
.t-light .c-nav-second__title {
border-right: none;
}
/* dark theme ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* main bar */
.t-dark.c-nav-second {
background-color: #595959;
border-bottom: none;
}
/* button style */
.t-dark .c-nav-second__btn-link {
color: #FFF;
}
.t-dark .c-nav-second__btn-link--w-ico {
background-image: url(svg/ico/ico-menu-drop.svg);
}
.t-dark .c-nav-second__btn-link:hover {
background-color: #666;
}
.t-dark .c-nav-second__btn--active > .c-nav-second__btn-link {
background-color: #666;
color: #fff;
}
/* title style */
.t-dark .c-nav-second__title {
border-right-color: #666666;
color: #FFF;
}
/* ===== ICO & TEXT =======================================================
Author: Simon Allin | 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-Welcome strip to display users name - company
*/
.c-acc-strip {
background-color: #fff;
border-bottom: solid 1px #ccc;
margin-bottom: 48px;
padding-top: 30px;
padding-bottom: 30px;
}
.c-acc-strip__title {
float: left;
width: auto;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 300;
color: #666;
margin-bottom: 0;
}
.c-acc-strip__title--user_name {
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
}
/* ===== MY ACC COMPONENT ===================================================
Author: Simon Allin | 2016 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for page tab navigation
-Includes optional sub level for additional page segregation
*/
.c-my-acc__exp-text {
font-family: "Mada", Arial, sans-serif;
font-size: 17px;
font-size: 1.7rem;
line-height: 1.4;
color: #292f33;
margin-bottom: 48px;
}
.c-my-acc__email-input-label {
float: left;
margin-right: 6px;
padding-top: 6px;
font-family: "Mada", Arial, sans-serif;
font-size: 17px;
font-size: 1.7rem;
line-height: 1.4;
color: #292f33;
}
.c-my-acc__radio-group-label {
font-family: "Mada", Arial, sans-serif;
font-size: 17px;
font-size: 1.7rem;
line-height: 1.4;
color: #292f33;
float: left;
margin-right: 96px;
}
.c-my-acc__radio-label {
font-family: "Mada", Arial, sans-serif;
font-size: 17px;
font-size: 1.7rem;
line-height: 1.4;
color: #292f33;
float: left;
margin-right: 24px;
width: webkit-calc(100% - (50px + 24px ));
width: -moz-calc(100% - (50px + 24px ));
width: calc(100% - (50px + 24px ));
position: relative;
bottom: -4px;
}
.c-my-acc__checkbox-label {
font-family: "Mada", Arial, sans-serif;
font-size: 17px;
font-size: 1.7rem;
line-height: 1.4;
color: #292f33;
display: inline;
}
.c-my-acc__checkbox-label--secondary {
font-family: "Mada", Arial, sans-serif;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.4;
}
.c-my-acc__radio-input {
float: left;
margin-top: 5px;
margin-right: 6px;
}
.c-my-acc_input--w-add-button {
width: webkit-calc(100% - (70px - 6px ));
width: -moz-calc(100% - (70px - 6px ));
width: calc(100% - (70px - 6px ));
float: left;
margin-right: 6px;
}
@media (min-width: 1152px) {
.c-my-acc_col--1 {
float: left;
width: webkit-calc(45% - 24px );
width: -moz-calc(45% - 24px );
width: calc(45% - 24px );
margin-right: 24px;
}
}
@media (min-width: 1152px) {
.c-my-acc_col--2 {
float: left;
width: 55%;
}
}
.c-my-acc-site-nav {
border: 1px solid #cccccc;
background-image: none;
}
@media (min-width: 61.25em) {
.c-my-acc-site-nav {
border: 0;
padding: 48px;
}
}
@media (min-width: 61.25em) {
.c-my-acc-site-nav--jes {
background-image: url("/img/sme-background.jpg");
background-position: center center;
padding: 48px;
}
}
.c-my-acc-site-nav__action {
margin-right: 12px;
letter-spacing: -0.5px;
}
.c-my-acc-site-nav__action:last-of-type {
margin-right: 0;
}
.c-my-acc-site-nav__action > a {
color: #FFF;
}
@media (max-width: 61.24em) {
.c-my-acc-site-nav__action > a {
color: #292f33;
display: block;
float: none;
background: none;
text-align: left;
padding: 0;
font-weight: 400;
}
.c-my-acc-site-nav__action > a:hover {
background: none;
color: #292f33;
}
}
.c-my-acc-site-nav__action--site-title {
font-size: 24px;
font-size: 2.4rem;
}
@media (max-width: 61.24em) {
.c-my-acc-site-nav__action--site-title {
display: none;
}
}
@media (min-width: 61.25em) {
.c-my-acc-site-nav__action-wrapper {
float: right;
}
}
@media (max-width: 61.24em) {
.c-my-acc-site-nav__action-wrapper .c-my-acc-site-nav__action {
margin-bottom: 24px;
font-family: "Mada", Arial, sans-serif;
font-size: 17px;
font-size: 1.7rem;
letter-spacing: 0;
}
.c-my-acc-site-nav__action-wrapper .c-my-acc-site-nav__action:last-of-type {
margin-bottom: 0;
}
}
@media (min-width: 61.25em) {
.c-my-acc-site-nav__action-wrapper .c-my-acc-site-nav__action {
float: left;
margin-bottom: 0;
}
}
/* ======================================================================
js classes ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
@media (max-width: 61.24em) {
.js-jes-nav__trigger {
display: block;
height: 60px;
padding: 12px;
cursor: pointer;
}
}
.js-jes-nav__trigger-ico {
float: left;
width: 24px;
height: auto;
margin-right: 12px;
}
.js-jes-nav__trigger-label {
float: left;
width: webkit-calc(100% - ( 24px + 12px ));
width: -moz-calc(100% - ( 24px + 12px ));
width: calc(100% - ( 24px + 12px ));
height: auto;
padding: 6px;
padding-top: 8px;
font-size: 20px;
font-size: 2rem;
}
@media (max-width: 61.24em) {
.js-jes-nav__wrapper {
display: none;
border-top: 1px solid #cccccc;
padding: 24px;
}
}
.js-jes-nav__wrapper.s-show {
display: block;
}
.c-page-banner {
padding: 48px;
background-size: cover;
background-position: center center;
margin-bottom: 24px;
}
/* ======================================================================
cross screen color strips ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-color-row {
background: #666;
padding-top: 96px;
padding-bottom: 96px;
}
.c-color-row--light-grey {
background: #e7e7e7;
}
.c-color-row--light-grey-border {
background: #FFF;
border: 3px solid #e7e7e7;
}
.c-color-row--mid-padd {
padding-top: 48px;
padding-bottom: 48px;
}
.c-color-row--l-border {
background: #FFF;
border-left: 3px solid #e7e7e7;
padding-left: 24px;
}
.video-center {
display: block;
width: 560px;
height: 315px;
margin-left: auto;
margin-right: auto;
}
@media (min-width: 61.25em) {
.c-my-acc__blacklist-table--name {
width: 500px;
}
}
.c-my-acc-form__input {
border: 1px solid #CCCCCC;
padding: 8px;
color: #292f33;
font-size: 17px;
font-size: 1.7rem;
}
/* ===== TAG COMPONENT =======================================================
Author: Simon Allin | 2016 |
========================================================================== */
/* DOCUMENT INFORMATION
-for anything that needs styling like a tag
-labels
-categories
-types
- includes tag with action icon
+------------+ +-----------+ +-----------+
| | | | | |
| TAG 1 | | TAG 2 | | TAG 2 |
| | | | | |
+------------+ +-----------+ +-----------+
*/
.c-tag {
font-family: "Mada", Arial, sans-serif;
font-size: 14px;
font-size: 1.4rem;
margin-right: 8px;
margin-bottom: 8px;
padding: 4px 8px;
float: left;
display: inline;
border: 1px solid #cccccc;
line-height: 1.6;
}
.c-tag--magenta {
border: 1px solid #ff5892;
color: #ff5892;
}
.c-tag--magenta:hover {
color: #ff5892;
transition: 0s;
text-decoration: underline;
}
.c-tag--magenta-solid {
background-color: #ff7979;
color: #FFF;
border: none;
font-weight: 500;
}
.c-tag--orange {
border: 1px solid #ff9f6f;
color: #ff9f6f;
}
.c-tag--orange:hover {
color: #ff9f6f;
transition: 0s;
text-decoration: underline;
}
.c-tag-fill--magenta {
border: 1px solid rgba(255, 51, 102, 0.08);
background-color: rgba(255, 51, 102, 0.08);
color: #ff5892;
}
.c-tag-fill--magenta:hover {
background-color: white;
border-color: #ff5892;
text-decoration: none;
}
.c-tag-fill--orange {
border: 1px solid rgba(255, 102, 0, 0.08);
background-color: rgba(255, 102, 0, 0.08);
color: #ff9f6f;
}
.c-tag-fill--orange:hover {
background-color: white;
border-color: #ff9f6f;
text-decoration: none;
}
.c-tag-fill--blue {
border: 1px solid rgba(0, 160, 221, 0.08);
background-color: rgba(0, 160, 221, 0.08);
color: #0088CA;
}
.c-tag-fill--blue:hover {
background-color: white;
border-color: #0088CA;
text-decoration: none;
}
.c-tag-fill--blue-bold {
color: #FFF;
background: #54a3d8;
border-color: #54a3d8;
}
.c-tag-fill--blue-bold:hover {
border-color: #a7d0eb;
color: #a7d0eb;
transition: 0s;
color: #FFF;
}
.c-tag--sml {
font-size: 12px;
font-size: 1.2rem;
}
.c-tag--blue {
color: #54a3d8;
border: 1px solid #54a3d8;
}
.c-tag--blue:hover {
color: #54a3d8;
transition: 0s;
text-decoration: underline;
}
.c-tag--blue-rev {
color: #FFF;
background: #54a3d8;
border-color: #54a3d8;
}
.c-tag--blue-rev:hover {
border-color: #3f98d3;
background: #3f98d3;
color: #a7d0eb;
transition: 0s;
color: #FFF;
}
.c-tag--magenta-rev {
color: #FFF;
background: #ff5892;
border-color: #ff5892;
}
.c-tag--magenta-rev:hover {
border-color: #ffbed5;
background: #ff3f81;
color: #ffbed5;
transition: 0s;
color: #FFF;
}
.c-tag--grey {
background: #cccccc;
color: #666;
border: none;
}
.c-tag--grey:hover {
color: #ff5892;
transition: 0s;
}
.c-tag--alone {
margin-right: 0;
margin-bottom: 0;
}
.c-tag--small {
font-size: 10px;
font-size: 1rem;
padding: 0px 3px;
}
.c-tag--medium {
font-size: 13px;
font-size: 1.3rem;
padding: 2px 4px;
}
.c-tag--lrg {
font-size: 16px;
font-size: 1.6rem;
}
.c-tag--xl {
font-size: 18px;
font-size: 1.8rem;
font-weight: 700;
}
.c-tag--cc {
float: left;
margin-top: 2px;
margin-right: 5px;
border-color: #ff5892;
color: #ff5892;
margin-bottom: 0;
}
.c-tag--fc {
float: left;
margin-top: 2px;
margin-right: 5px;
border-color: #ff9f6f;
color: #ff9f6f;
margin-bottom: 0;
}
.c-tag--trial {
margin-left: 6px;
margin-top: -8px;
margin-bottom: 0;
border-color: #16cbbe;
color: #16cbbe;
padding: 3px;
float: right;
font-size: 12px;
font-size: 1.2rem;
max-height: 26px;
}
.c-tag--tick {
border: 2px solid #ccc;
padding-left: 36px;
background-image: url(svg/ico/btn/ico-btn-tick.svg);
background-size: 18px;
background-repeat: no-repeat;
background-position: left 8px center;
}
.c-tag--max {
max-width: 100%;
}
.c-tag--ico-delete {
float: right;
background-repeat: no-repeat;
background-image: url(svg/ico/ico-close-grey.svg);
background-position: left top;
width: 10px;
height: 10px;
cursor: pointer;
margin-top: 6px;
margin-left: 6px;
}
.c-tag--ico-delete--magenta {
background-image: url(svg/ico/ico-close-magenta.svg);
}
/* ==========================================================================
Extends tag to draw border ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-tag-draw {
background: none;
border: 1px solid transparent;
box-sizing: border-box;
position: relative;
-webkit-animation: fadeInFromNone 1s ease-out forwards;
-khtml-animation: fadeInFromNone 1s ease-out forwards;
-moz-animation: fadeInFromNone 1s ease-out forwards;
-ms-animation: fadeInFromNone 1s ease-out forwards;
-o-animation: fadeInFromNone 1s ease-out forwards;
animation: fadeInFromNone 1s ease-out forwards;
}
.c-tag-draw::before, .c-tag-draw::after {
box-sizing: inherit;
content: "";
position: absolute;
width: 100%;
height: 100%;
border: 1px solid transparent;
width: 0;
height: 0;
}
.c-tag-draw::before {
top: 0;
left: 0;
-webkit-animation: drawBorderTopThenRight 0.5s ease-out forwards;
-khtml-animation: drawBorderTopThenRight 0.5s ease-out forwards;
-moz-animation: drawBorderTopThenRight 0.5s ease-out forwards;
-ms-animation: drawBorderTopThenRight 0.5s ease-out forwards;
-o-animation: drawBorderTopThenRight 0.5s ease-out forwards;
animation: drawBorderTopThenRight 0.5s ease-out forwards;
-webkit-animation-delay: 0.5s;
-khtml-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-ms-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c-tag-draw::after {
bottom: 0;
right: 0;
-webkit-animation: drawBorderBottomThenLeft 0.5s ease-out forwards;
-khtml-animation: drawBorderBottomThenLeft 0.5s ease-out forwards;
-moz-animation: drawBorderBottomThenLeft 0.5s ease-out forwards;
-ms-animation: drawBorderBottomThenLeft 0.5s ease-out forwards;
-o-animation: drawBorderBottomThenLeft 0.5s ease-out forwards;
animation: drawBorderBottomThenLeft 0.5s ease-out forwards;
}
@keyframes drawBorderBottomThenLeft {
0% {
width: 0%;
height: 0%;
border-bottom-color: transparent;
border-left-color: transparent;
}
50% {
width: 100%;
height: 0%;
border-bottom-color: #ff5892;
border-left-color: transparent;
}
100% {
height: 100%;
width: 100%;
border-bottom-color: #ff5892;
border-left-color: #ff5892;
}
}
@keyframes drawBorderTopThenRight {
0% {
width: 0%;
height: 0%;
border-top-color: transparent;
border-left-color: transparent;
}
50% {
width: 100%;
height: 0%;
border-top-color: #ff5892;
border-right-color: transparent;
}
100% {
height: 100%;
width: 100%;
border-top-color: #ff5892;
border-right-color: #ff5892;
}
}
@keyframes fadeInFromNone {
0% {
display: none;
opacity: 0;
}
1% {
display: block;
opacity: 0;
}
100% {
display: block;
opacity: 1;
}
}
/* ==========================================================================
Container for tags ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-tag-container--top-border {
border-top: 2px dotted #d3d3d3;
border-top-width: 3px;
margin-bottom: 24px;
padding: 12px 0 12px 0;
}
@media (min-width: 46.25em) {
.c-tag-container--left-border {
border-left-width: 3px;
border-left: 2px dotted #d3d3d3;
padding-left: 24px;
}
}
/* ==========================================================================
Border box to create tag style ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ==========================================================================
Category ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.category-list {
margin-top: 10px;
margin-bottom: 5px;
padding-top: 10px;
}
@media (min-width: 1024px) {
.category-list {
float: right;
display: inline;
margin-top: 0px;
margin-bottom: 0px;
padding-top: 0px;
overflow: auto;
}
}
.category-list__title {
margin-top: 20px;
margin-bottom: 20px;
}
@media (min-width: 1024px) {
.category-list__title {
float: left;
display: inline;
width: 170px;
margin-top: 0;
margin-bottom: 0;
}
}
.category-list__block {
display: block;
float: none;
}
.category-list__item {
margin-right: 8px;
margin-bottom: 8px;
padding-top: 4px;
padding-right: 8px;
padding-bottom: 4px;
padding-left: 8px;
float: left;
display: inline;
border: 1px solid #cccccc;
background: white;
}
.category-list__item--hidden {
display: none;
}
.category-list__item.s-show {
display: block;
}
.category-list__item--title {
width: 100%;
border: none;
}
@media (min-width: 550px) {
.category-list__item--title {
width: auto;
}
}
.category-list__link {
float: left;
}
.category-list--widget {
width: 45%;
max-height: 400px;
}
.category-list__toggle {
cursor: pointer;
position: relative;
right: 4px;
}
.category-list__toggle:hover {
color: #333;
}
.category-list__toggle > i {
position: relative;
left: 4px;
top: 6px;
}
.category-list__toggle--hide {
display: none;
}
.ui-notification {
position: fixed;
z-index: 9999;
width: 370px;
min-height: 67.5px;
padding: 12.5px;
cursor: pointer;
background: white;
background-size: 35px;
background-position: 14px 14px;
border: 2px solid #666;
-webkit-transition: all ease 0.3s;
-khtml-transition: all ease 0.3s;
-moz-transition: all ease 0.3s;
-ms-transition: all ease 0.3s;
-o-transition: all ease 0.3s;
transition: all ease 0.3s;
}
.ui-notification.success {
border-color: #16cbbe;
background-image: url(/svg/ico-tick-22-22.svg);
background-repeat: no-repeat;
}
.ui-notification.error {
border-color: #ff7979;
background-image: url(/svg/ico-cross-22-22.svg);
background-repeat: no-repeat;
}
.ui-notification.warning {
border-color: #ff7979;
background-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3C%21--%20Generator%3A%20Adobe%20Illustrator%2019.1.0%2C%20SVG%20Export%20Plug-In%20.%20SVG%20Version%3A%206.00%20Build%200%29%20%20--%3E%0A%3Csvg%20version%3D%221.1%22%20id%3D%22ico-circle-tick%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20x%3D%220px%22%20y%3D%220px%22%0A%09%20viewBox%3D%220%200%2040%2040%22%20%20xml%3Aspace%3D%22preserve%22%3E%0A%0A%20%20%20%20%0A%3Cpolygon%20class%3D%22st0%22%20points%3D%2228%2C12%2017%2C23%2012%2C18%2012%2C23%2017%2C28%2028%2C17%20%22/%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M20%2C1.333c10.293%2C0%2C18.667%2C8.374%2C18.667%2C18.667S30.293%2C38.667%2C20%2C38.667S1.333%2C30.293%2C1.333%2C20%0A%09S9.707%2C1.333%2C20%2C1.333%20M20%2C0C8.954%2C0%2C0%2C8.954%2C0%2C20s8.954%2C20%2C20%2C20s20-8.954%2C20-20S31.046%2C0%2C20%2C0L20%2C0z%22/%3E%0A%3C/svg%3E%0A");
background-repeat: no-repeat;
}
.ui-notification.info {
border-color: #3c668d;
background-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3C%21--%20Generator%3A%20Adobe%20Illustrator%2019.1.0%2C%20SVG%20Export%20Plug-In%20.%20SVG%20Version%3A%206.00%20Build%200%29%20%20--%3E%0A%3Csvg%20version%3D%221.1%22%20id%3D%22ico-circle-tick%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20x%3D%220px%22%20y%3D%220px%22%0A%09%20viewBox%3D%220%200%2040%2040%22%20%20xml%3Aspace%3D%22preserve%22%3E%0A%0A%20%20%20%20%0A%3Cpolygon%20class%3D%22st0%22%20points%3D%2228%2C12%2017%2C23%2012%2C18%2012%2C23%2017%2C28%2028%2C17%20%22/%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M20%2C1.333c10.293%2C0%2C18.667%2C8.374%2C18.667%2C18.667S30.293%2C38.667%2C20%2C38.667S1.333%2C30.293%2C1.333%2C20%0A%09S9.707%2C1.333%2C20%2C1.333%20M20%2C0C8.954%2C0%2C0%2C8.954%2C0%2C20s8.954%2C20%2C20%2C20s20-8.954%2C20-20S31.046%2C0%2C20%2C0L20%2C0z%22/%3E%0A%3C/svg%3E%0A");
background-repeat: no-repeat;
}
.ui-notification.info {
color: #fff;
background: #5bc0de;
}
.ui-notification .message {
width: 290px;
float: right;
display: inline;
font-family: "Mada", Arial, sans-serif;
font-size: 23px;
font-size: 2.3rem;
line-height: 1.3;
letter-spacing: -0.7px;
color: #292f33;
}
.ui-notification.killed {
-webkit-transition: all ease 0.3s;
-khtml-transition: all ease 0.3s;
-moz-transition: all ease 0.3s;
-ms-transition: all ease 0.3s;
-o-transition: all ease 0.3s;
transition: all ease 0.3s;
opacity: 0;
display: none;
}
/* ---------------------------------------------------------------------
ResponseSource logo system
1) SETUP
2) LOGOS
.logo-RS-MCD
.logo-RS-MCD--FR - lang modifiers
.logo-RS-MCD--DE - lang modifiers
.logo-RS-JES
.logo-RS-JES--FR - lang modifiers
.logo-RS-JES--DE - lang modifiers
.logo-RS-JES--DE-STACKED - legacy stacked
.logo-RS-JES--FR-STACKED - legacy stacked
.logo-RS-FJP
.logo-RS-PRW
--------------------------------------------------------------------- */
.logo_space h1, #logo_space h1 {
margin: 0 0 0 0;
padding: 0 0 0 0;
}
/* AI Brand Portals --------------------------- */
.ai-logo-portal {
background-repeat: no-repeat;
}
.ai-logo-portal--rs {
background-image: url(svg/brand-logos/responsesource/portal/white-reversed.svg);
}
.ai-logo-portal--rs-color {
background-image: url(svg/brand-logos/responsesource/portal/orange-on-transparent.svg);
}
.ai-logo-portal--rs-black {
background-image: url(svg/brand-logos/responsesource/Responsesource-LogoMark-Black.svg);
}
.ai-logo-portal--vuelio {
background-image: url(svg/brand-logos/vuelio/portal/white-reversed.svg);
}
.ai-logo-portal--vuelio-color {
background-image: url(svg/brand-logos/vuelio/portal/pink-on-transparent.svg);
}
.ai-logo-portal--vuelio-black {
background-image: url(svg/brand-logos/vuelio/Vuelio-LogoMark-Black.svg);
}
.ai-logo-portal--accessintelligence {
background-image: url(svg/brand-logos/accessintelligence/portal/white-reversed.svg);
}
.ai-logo-portal--accessintelligence-color {
background-image: url(svg/brand-logos/accessintelligence/portal/blue-on-transparent.svg);
}
.ai-logo-portal--pulsar {
background-image: url(svg/brand-logos/pulsar/Pulsar-Mark-White-Reversed.svg);
}
.ai-logo-portal--pulsar-color {
background-image: url(svg/brand-logos/pulsar/Pulsar-Mark-Color-On-Transparent.svg);
}
.ai-logo-portal--pulsar-black {
background-image: url(svg/brand-logos/pulsar/Pulsar-LogoMark-Black.svg);
}
.ai-logo-portal--isentia {
background-image: url(svg/brand-logos/isentia2/Isentia-Mark-White-Reversed.svg);
}
.ai-logo-portal--isentia-color {
background-image: url(svg/brand-logos/isentia2/Isentia-Mark-Color-On-Transparent.svg);
}
.ai-logo-text {
background-repeat: no-repeat;
}
.ai-logo-text--rs {
background-image: url(svg/brand-logos/responsesource/orange-on-transparent.svg);
}
.ai-logo-text--vuelio {
background-image: url(svg/brand-logos/vuelio/pink-on-transparent.svg);
}
.ai-logo-text--accessintelligence {
background-image: url(svg/brand-logos/accessintelligence/blue-on-transparent.svg);
}
.ai-logo-complete {
background-repeat: no-repeat;
}
.ai-logo-complete--accessintelligence {
background-image: url(svg/brand-logos/accessintelligence/Accessintelligence-Complete.svg);
}
.ai-logo-complete--pulsarGroup {
background-image: url(svg/brand-logos/pulsarGroup/Pulsar-Group-Wordmark-LogoMark-Black.svg);
}
.ai-logo-complete--pulsarGroup-stacked {
background-image: url(svg/brand-logos/pulsarGroup/Pulsar-Group-Wordmark-LogoMark-Stacked-Black.svg);
}
.ai-logo-complete--vuelio {
background-image: url(svg/brand-logos/vuelio/Vuelio-Complete.svg);
}
.ai-logo-complete--responsesource {
background-image: url(svg/brand-logos/responsesource/Responsesource-Complete.svg);
}
.logo {
/* ================================================
SWITCH PORTRAIT TO LANDSCAPE BELOW CERTAIN WIDTH
================================================ */
/* ============
MOBILE LOGOS
============ */
}
.logo-RS {
display: block;
width: 420px;
height: 86px;
background-size: 420px 86px;
background-repeat: no-repeat;
background-image: url(svg/RS-315-63.svg);
background-image: url(svg/brand-logos/responsesource/orange-on-transparent.svg);
}
@media (max-width: 550px) {
.logo-RS {
width: 286px;
height: 59px;
background-size: 286px;
}
}
.logo-RS--FOOTER {
width: 325px;
height: 70px;
background-size: 325px;
margin: 0 auto;
}
@media (min-width: 768px) {
.logo-RS--FOOTER {
margin: 0;
}
}
@media (max-width: 550px) {
.logo-RS--FOOTER {
width: 286px;
height: 59px;
background-size: 286px;
}
}
.logo-RS--SOLO {
background-image: url(svg/brand-logos/responsesource/orange-on-transparent.svg);
}
.logo-RS--SOLO-REV {
width: 420px;
background-image: url(svg/brand-logos/responsesource/white-reversed.svg);
}
.logo-RS--NAV {
width: 50px;
height: 50px;
background-size: 34px 34px;
background-image: url(svg/brand-logos/responsesource/portal/orange-on-transparent.svg);
padding: 8px;
background-position: 50%;
-webkit-transition: all 0.2s linear;
-khtml-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
}
@media (max-width: 34.365em) {
.logo-RS--NAV-tile {
width: auto;
background-size: 50px;
background-position: center center;
}
}
@media (min-width: 550px) {
.logo-RS--NAV {
width: 218px;
background-size: 210px 34px;
background-image: url(svg/brand-logos/responsesource/orange-on-transparent.svg);
}
}
@media (min-width: 550px) {
.logo-RS--NAV-FR {
background-size: 180px;
}
}
.logo-RS--APP-SWITCH {
width: 218px;
height: 35px;
background-size: 210px 34px;
background-image: url(svg/brand-logos/responsesource/orange-on-transparent.svg);
}
.logo-RS-MCD {
display: block;
width: 420px;
height: 86px;
background-size: 420px 86px;
background-repeat: no-repeat;
background-image: url(svg/RS-MCD-315-63.svg);
}
.logo-RS-JES {
display: block;
width: 420px;
height: 86px;
background-size: 420px 86px;
background-repeat: no-repeat;
background-image: url(svg/RS-JES-315-63.svg);
/* .logo.center { margin: 0 auto !important; } */
}
@media (max-width: 550px) {
.logo-RS-JES {
width: 286px;
height: 59px;
background-size: 286px;
}
}
.logo-RS-JES--FR {
background-image: url(svg/RS-315-63.svg);
}
.logo-RS-JES-FJP {
display: block;
width: 420px;
height: 86px;
background-size: 420px 86px;
background-repeat: no-repeat;
background-image: url(svg/RS-FJP-315-63.svg);
}
@media (max-width: 550px) {
.logo-RS-JES-FJP {
width: 286px;
height: 59px;
background-size: 286px;
}
}
.logo-RS-JES-PRW {
display: block;
width: 420px;
height: 86px;
background-size: 420px 86px;
background-repeat: no-repeat;
background-image: url(svg/RS-PRW-315-63.svg);
}
@media (max-width: 550px) {
.logo-RS-JES-PRW {
width: 286px;
height: 59px;
background-size: 286px;
}
}
.logo-RS-JES-MJ {
display: block;
width: 420px;
height: 86px;
background-size: 420px 86px;
background-repeat: no-repeat;
width: 399px;
height: 81px;
background-size: 399px 81px;
background-image: url(svg/RS-MJ-315-63.svg);
display: block;
text-indent: -9999px;
}
.logo-RS-JES--center {
margin-right: auto;
margin-left: auto;
}
@media only screen and (min-width: 768px) {
.logo {
/* top margin for homepage logo */
}
.logo .home_page .product_logo {
margin-top: 15px;
}
}
@media only screen and (max-width: 767px) {
.logo .product_logo.RS.stacked.mob_landscape.lrg, .logo .product_logo.RSINTL_UK.stacked.mob_landscape.lrg {
width: 414px;
height: 129px;
background: transparent url(img/logo/RS_INT_EN_LOGO_LAND_414X129.png) no-repeat;
margin: 0 0 0 0;
}
.logo .product_logo.RS.FR.stacked.mob_landscape.lrg.mobile_landscape, .logo .product_logo.RSINTL_FR.stacked.mob_landscape.lrg {
width: 436px;
height: 129px;
background-image: url(img/logo/RS_INT_FR_LOGO_LAND_436X129.png);
margin: 0 0 0 0;
}
.logo .product_logo.RS.DE.stacked.mob_landscape.lrg.mobile_landscape, .logo .product_logo.RSINTL_DE.stacked.mob_landscape.lrg {
width: 503px;
height: 129px;
background-image: url(img/logo/RS_INT_DE_LOGO_LAND_503X129.png);
margin: 0 0 0 0;
}
.logo .product_logo.SW.stacked.mob_landscape.lrg {
width: 414px;
height: 129px;
background: url(img/logo/SW_EN_LOGO_LAND_414_129.png) no-repeat center center;
margin: 0 0 0 0;
}
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
.logo {
/* ============
MOBILE LOGOS
============ */
/* ==
UK
== */
/* ==
FR
== */
}
.logo .product_logo.RS.stacked.lrg, .logo .product_logo.RSINTL_UK.stacked.lrg {
width: 286px;
height: 161px;
background-size: 286px;
}
.logo .product_logo.RSINTL_UK.stacked.mob_landscape.lrg, .logo .product_logo.RSINTL_UK.landscape.lrg {
width: 300px;
height: 79px;
background-size: 300px;
}
.logo .product_logo.RS.stacked.lrg, .logo .product_logo.RSINTL_UK.stacked.lrg {
width: 286px;
height: 169px;
background-size: 286px;
}
.logo .product_logo.FE.stacked.lrg, .logo .product_logo.FEM.stacked.lrg {
width: 286px;
height: 169px;
background-size: 286px;
}
.logo .product_logo.SW.stacked.lrg {
width: 286px;
height: 169px;
background-size: 286px;
}
.logo .product_logo.SW.stacked.mob_landscape.lrg, .logo .product_logo.SW.landscape.lrg {
width: 300px;
height: 79px;
background: url(img/logo/SW_EN_LOGO_LAND_414_129.png) no-repeat center center;
margin: 0 0 0 0;
background-size: 300px;
}
.logo .product_logo.JD.stacked.lrg, .logo .product_logo.FJD.stacked.lrg {
width: 286px;
height: 161px;
background: url(img/logo/JD_EN_LOGO_STACKED_572_322_X2.png) no-repeat;
background-size: 286px;
}
.logo .product_logo.DWP {
width: 286px;
height: 161px;
background-size: 286px;
}
.logo .logo.RS.FR.stacked.lrg, .logo .logo.RSINTL_FR.stacked.lrg {
width: 286px;
height: 161px;
background-size: 286px;
}
.logo .logo.RSINTL_FR.stacked.mob_landscape.lrg, .logo .logo.RSINTL_FR.landscape.lrg {
width: 300px;
height: 79px;
background: transparent url(img/logo/RS_INT_FR_LOGO_LAND_700_157_X2.png) no-repeat;
background-size: 315px;
}
.logo .logo.FE.FR.stacked.lrg, .logo .logo.FEM.FR.stacked.lrg {
width: 286px;
height: 161px;
background-size: 286px;
}
.logo .logo.SW.FR.stacked.lrg {
width: 286px;
height: 161px;
background-size: 286px;
}
}
/* ===== HIGHLIGHT COMPONENT ================================================
Author: Simon Allin | 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for adding text highlight boxes on pages
+----------------------------+
| |
| ~~~~~~~~~~~~~~~~~~~~ |
| ~~~~~~~~~~~~~~~~~~~~ |
| ~~~~~~~~~~~~~~~~~~~~ |
| |
+----------------------------+
*/
.c-highlight {
border: 2px solid #ccc;
background: #F9F9F9;
padding: 15px;
color: #292f33;
margin-bottom: 24px;
font-family: "Mada", Arial, sans-serif;
font-size: 17px;
font-size: 1.7rem;
line-height: 1.4;
color: #292f33;
}
.c-highlight--pink {
border-color: #ff8bb3;
}
.c-highlight--error {
color: #ff5892;
border-color: #ff5892;
}
.c-highlight--success {
border-color: #16cbbe;
}
.c-highlight--tick {
border-color: #77B847;
background-image: url(svg/ico/ico-success-62-62.svg);
background-repeat: no-repeat;
padding-bottom: 80px;
background-position: center bottom 12px;
}
.c-highlight--font-lrg {
font-size: 20px;
font-size: 2rem;
}
.c-highlight--font-sml {
font-size: 14px;
font-size: 1.4rem;
}
.c-highlight > p:last-of-type {
margin-bottom: 0;
}
.c-highlight--control-margin * {
margin-top: 0;
margin-bottom: 12px;
}
.c-highlight__text--small {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.4;
letter-spacing: -0.2px;
}
.highlight-panel {
font-family: "Mada", Arial, sans-serif;
font-size: 23px;
font-size: 2.3rem;
line-height: 28px;
padding: 20px;
text-align: center;
}
.highlight-panel h2 {
font-family: "Mada", Arial, sans-serif;
}
.highlight-panel__bold {
font-weight: 700;
}
.highlight-panel--text-left {
text-align: left;
}
.highlight-panel--yellow {
border: 3px solid #ff7979;
background-color: white;
color: #ff7979;
}
.highlight-panel--yellow h2 {
color: #ff7979;
}
.highlight-panel--green {
border: 3px solid #16cbbe;
background-color: #d6fbf8;
color: #16cbbe;
}
.highlight-panel--green h2 {
color: #16cbbe;
}
.highlight-panel--red {
border: 3px solid #ff7979;
background-color: white;
color: #ff7979;
}
.highlight-panel--red h2 {
color: #ff7979;
}
.highlight-panel--blue {
border: 3px solid #3c668d;
background-color: #ebf1f6;
color: #3c668d;
}
.highlight-panel--blue h2 {
color: #3c668d;
}
.highlight-panel--grey {
border: 3px solid #999999;
background-color: #f2f2f2;
}
.highlight-panel--grey h2 {
color: #999999;
}
/* ===== SIDE BAR NAV =======================================================
Author: Simon Allin | 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for side navigation
+~~~~~~~~~~~~~~~~~~~~~~~~~+
¦ +---+ +---------------+ ¦
¦ +---+ | | ¦
¦ +---+ | | ¦
¦ +---+ | | ¦
¦ +---+ | | ¦
¦ +---+ | | ¦
¦ | | ¦
¦ | | ¦
¦ +---------------+ ¦
+~~~~~~~~~~~~~~~~~~~~~~~~~+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-side-nav {
font-size: 17px;
font-size: 1.7rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 500;
}
@media (max-width: 61.24em) {
.c-side-nav {
border: 1px solid #cccccc;
border-bottom: none;
margin-top: 24px;
}
}
@media (max-width: 61.24em) {
.c-side-nav--solo {
margin-bottom: 24px;
border-bottom: 1px solid #cccccc;
}
}
.c-side-nav__sub-menu {
padding-top: 24px;
}
@media (min-width: 61.25em) {
.c-side-nav__sub-menu {
padding-left: 24px;
}
}
.c-side-nav__action {
margin-bottom: 24px;
}
.c-side-nav__action > a {
color: #292f33;
line-height: 1.5;
}
.c-side-nav__action > a:hover {
text-decoration: none;
}
.c-side-nav__action.s-active > a {
padding-bottom: 2px;
border-bottom: 2px solid #ff5892;
}
@media (max-width: 61.24em) {
.c-side-nav__action:last-of-type {
margin-bottom: 6px;
}
}
/* ======================================================================
js classes ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
@media (max-width: 61.24em) {
.js-app-nav__trigger {
display: block;
height: 60px;
padding: 12px;
cursor: pointer;
}
}
.js-app-nav__trigger-ico {
float: left;
width: 24px;
height: auto;
margin-right: 12px;
}
.js-app-nav__trigger-label {
float: left;
width: webkit-calc(100% - ( 24px + 12px ));
width: -moz-calc(100% - ( 24px + 12px ));
width: calc(100% - ( 24px + 12px ));
height: auto;
padding: 6px;
padding-top: 8px;
font-size: 20px;
font-size: 2rem;
font-family: "Mada", Arial, sans-serif;
font-weight: 500;
}
@media (max-width: 61.24em) {
.js-app-nav__wrapper {
display: none;
border-top: 1px solid #cccccc;
padding: 24px;
margin-bottom: 0;
}
}
.js-app-nav__wrapper.s-show {
display: block;
}
/* ===== RELEASE / ENQUIRY LIST =============================================
Author: Simon Allin | August 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for listing releases / enquiries on a page
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
¦ Date ¦ Title ¦ Category ¦
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
¦ Date ¦ Title ¦ Category ¦
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
¦ Date ¦ Title ¦ Category ¦
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-rel-enq-list {
margin-bottom: 24px;
list-style-type: none;
margin: 0;
padding: 0;
font-size: 18px;
font-size: 1.8rem;
}
.c-rel-enq-list__item {
*zoom: 1;
border-left: 3px solid #ff6699;
padding-left: 6px;
margin-bottom: 3px;
}
.c-rel-enq-list__item:before, .c-rel-enq-list__item:after {
content: " ";
display: table;
}
.c-rel-enq-list__item:after {
clear: both;
}
@media (min-width: 61.25em) {
.c-rel-enq-list__item {
padding-left: 0;
}
}
.c-rel-enq-list__item--simple {
border-bottom: 1px solid #cccccc;
}
.c-rel-enq-list__item--simple:first-of-type {
border-top: 1px solid #cccccc;
}
.c-rel-enq-list__item--meta {
background-color: rgba(51, 51, 51, 0.05);
}
.c-rel-enq-list__item--meta:first-child {
border-right: 1px solid #cccccc;
}
.c-rel-enq-list__item a:hover {
text-decoration: none;
}
.c-rel-enq-list__item a:hover .c-rel-enq-list__title {
background-color: rgba(51, 51, 51, 0.05);
}
.c-rel-enq-list__element {
color: #666;
padding: 12px 0;
display: inline-block;
margin-right: -4px;
vertical-align: top;
}
@media (min-width: 61.25em) {
.c-rel-enq-list__element {
padding: 12px;
}
}
.c-rel-enq-list__element--meta {
padding: 6px 0;
}
@media (min-width: 61.25em) {
.c-rel-enq-list__element--meta {
padding: 6px 12px;
}
}
.c-rel-enq-list__element--meta:nth-child(2) {
border-left: 1px solid #cccccc;
}
.c-rel-enq-list__element--meta + a:hover {
color: #ff5892;
transition: 0s;
}
.c-rel-enq-list__element--link {
color: #54a3d8;
}
.c-rel-enq-list__element--link:hover {
color: #ff5892;
transition: 0s;
}
.c-rel-enq-list__date {
background-color: rgba(51, 51, 51, 0.05);
}
@media (min-width: 61.25em) {
.c-rel-enq-list__date {
display: inline-block;
width: 130px;
text-align: center;
}
}
.c-rel-enq-list__type {
background-color: rgba(51, 51, 51, 0.05);
}
@media (min-width: 61.25em) {
.c-rel-enq-list__type {
display: inline-block;
width: 100px;
text-align: center;
}
}
.c-rel-enq-list__title {
width: 100%;
display: block;
color: #333;
background-color: #D6D6D6;
}
@media (min-width: 61.25em) {
.c-rel-enq-list__title {
display: inline-block;
width: auto;
max-width: webkit-calc(100% - (150px + 40px));
max-width: -moz-calc(100% - (150px + 40px));
max-width: calc(100% - (150px + 40px));
}
}
.c-rel-enq-list__title > a {
color: #333;
}
.c-rel-enq-list__title > a:hover {
color: #ff5892;
transition: 0s;
}
.c-simple-list {
border-top: 1px solid #ccc;
}
.c-simple-list__item {
padding-top: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #ccc;
}
/* ======================================================================
new search result set ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* master settings */
.c-rslt-set {
font-size: 16px;
font-size: 1.6rem;
font-family: "Mada", Arial, sans-serif;
}
.c-rslt-set--enq-full {
font-size: 15px;
font-size: 1.5rem;
font-weight: 500;
}
/* row */
.c-rslt-set__r {
border-bottom: 1px solid #ccc;
}
.c-rslt-set__r--click {
cursor: pointer;
}
.c-rslt-set__r--click:hover {
background: #f8f8f8;
}
.c-rslt-set__r--selected {
background: #f1f1f1;
}
.c-rslt-set__r--selected:hover {
background: #f1f1f1;
}
.c-rslt-set__r--flex {
display: flex;
flex-wrap: wrap;
}
.c-rslt-set__r > a {
width: 100%;
}
.c-rslt-set__r > a:hover {
text-decoration: none;
}
/* row heading */
.c-rslt-set__rh {
font-size: 18px;
font-size: 1.8rem;
font-weight: 700;
}
/* row division */
.c-rslt-set__rd {
padding-top: 12px;
padding-bottom: 12px;
padding-right: 12px;
float: left;
}
.c-rslt-set__rd--date-time {
width: 200px;
}
.c-rslt-set__rd--mo {
width: 30%;
}
.c-rslt-set__rd--title {
width: webkit-calc(100% - ( 30% + 200px ));
width: -moz-calc(100% - ( 30% + 200px ));
width: calc(100% - ( 30% + 200px ));
}
.c-rslt-set__rd--p-title {
width: webkit-calc(100% - ( 30% + 60px ));
width: -moz-calc(100% - ( 30% + 60px ));
width: calc(100% - ( 30% + 60px ));
}
.c-rslt-set__rd--p-title-txt {
font-size: 20px;
font-size: 2rem;
font-weight: 700;
}
.c-rslt-set__rd--replies {
width: 30px;
}
.c-rslt-set__r--flex .c-rslt-set__rd {
flex: 0 0 auto;
}
.c-rslt-set__rd--img {
float: left;
width: 60px;
}
.c-rslt-set__rd--img > img {
width: 100%;
}
.c-rslt-set--enq-full .c-rslt-set__rd {
padding-top: 17px;
padding-bottom: 17px;
float: left;
}
.c-rslt-set--enq-full .c-rslt-set__rd--title {
font-weight: 700;
}
.c-rslt-set--enq-full .c-rslt-set__rd--title-min-width {
min-width: 150px;
}
.c-rslt-set--enq-full .c-rslt-set__rd--date-time {
width: 130px;
}
.c-rslt-set--enq-full .c-rslt-set__rd--mo {
width: 20%;
}
.c-rslt-set--enq-full .c-rslt-set__rd--title {
width: webkit-calc(100% - ( 20% + 130px * 4));
width: -moz-calc(100% - ( 20% + 130px * 4));
width: calc(100% - ( 20% + 130px * 4));
}
.o-row__division {
font-size: 0;
display: inline-block;
width: 100%;
}
.o-rd-parent-break-setting {
width: 100%;
}
@media (min-width: 34.375em) {
.o-rd-parent-break-setting\@mobile .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@mobile .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@mobile .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@mobile .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@mobile .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@mobile .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@mobile .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@mobile .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@mobile .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@mobile .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 46.25em) {
.o-rd-parent-break-setting\@tablet .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@tablet .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@tablet .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@tablet .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@tablet .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@tablet .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@tablet .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@tablet .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@tablet .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@tablet .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 52.5em) {
.o-rd-parent-break-setting\@medium .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@medium .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@medium .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@medium .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@medium .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@medium .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@medium .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@medium .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@medium .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@medium .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 61.25em) {
.o-rd-parent-break-setting\@desktop .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@desktop .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@desktop .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@desktop .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@desktop .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@desktop .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@desktop .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@desktop .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@desktop .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@desktop .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 64em) {
.o-rd-parent-break-setting\@desktop-medium .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 71.875em) {
.o-rd-parent-break-setting\@desktop-wide .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 81.25em) {
.o-rd-parent-break-setting\@wide .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@wide .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@wide .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@wide .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@wide .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@wide .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@wide .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@wide .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@wide .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@wide .o-rd--10\/12 {
width: 83.3333333333%;
}
}
/* ===== PRICING TABLE ================================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-component for pricing table
+-------------------------------+
| ~ | ~ | ~ | ~ | | ~ |
+-------------------------------+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-enq {
font-size: 16px;
font-size: 1.6rem;
font-family: "Mada", Arial, sans-serif;
line-height: 1.6;
padding-left: 24px;
border-left: 2px solid #ccc;
height: 100%;
}
.c-enq__header {
min-height: 66px;
padding-top: 24px;
padding-bottom: 24px;
}
.c-enq__body {
margin-right: 24px;
font-family: "Mada", Arial, sans-serif;
font-size: 22px;
font-size: 2.2rem;
line-height: 1.6;
font-weight: 500;
}
.c-enq__body--w-border-top {
border-top: 3px solid #e7e7e7;
}
.c-enq__title {
padding-top: 24px;
padding-bottom: 24px;
border-bottom: 2px solid #e7e7e7;
}
.c-enq__dtls {
padding-bottom: 24px;
border-bottom: 2px solid #ccc;
}
.c-enq__dtls-row {
margin-bottom: 6px;
}
.c-enq__dtls-row:last-of-type {
marign-bottom: 0;
}
.c-enq__dtls-label {
float: left;
width: 170px;
font-weight: 700;
margin-right: 12px;
}
.c-enq__txt:last-of-type {
margin-bottom: 0;
}
.c-enq__dtls-data {
float: left;
width: webkit-calc(100% - ( 170px + 12px ) );
width: -moz-calc(100% - ( 170px + 12px ) );
width: calc(100% - ( 170px + 12px ) );
}
.c-enq__body {
font-size: 17px;
font-size: 1.7rem;
padding-top: 24px;
padding-bottom: 24px;
}
.c-enq__section {
padding-top: 24px;
padding-bottom: 24px;
border-bottom: 2px solid #e7e7e7;
}
.c-enq__mo-img {
width: 200px;
height: auto;
float: left;
margin-right: 12px;
}
.c-enq__mo-dtls {
float: left;
width: webkit-calc(100% - ( 200px + 12px ) );
width: -moz-calc(100% - ( 200px + 12px ) );
width: calc(100% - ( 200px + 12px ) );
}
.c-enq__twitter {
float: left;
min-height: 30px;
padding-left: 36px;
background-size: 30px;
background-image: url(svg/ico/ico-twitter-actual-34-34.svg);
background-repeat: no-repeat;
}
.c-enq__contact {
float: left;
min-height: 30px;
padding-left: 36px;
background-size: 30px;
background-image: url(svg/ico/ico-contact-us.svg);
background-repeat: no-repeat;
}
.c-enq__placeholder {
margin-top: 100px;
height: 100%;
font-size: 40px;
font-size: 4rem;
color: #ccc;
font-weight: 700;
text-align: center;
}
/* ===== DINO LIST ====================================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-Placeholders / mixins / classes for base text styles
-.e- class names can be used directly in the HTML
*/
.c-dino-list {
margin-left: 0;
padding-left: 0;
}
.c-dino-list li {
list-style: none;
list-style-image: none;
}
.c-dino-list__heading {
font-size: 20px;
font-size: 2rem;
margin-bottom: 12px;
}
.c-dino-list__item {
font-size: 20px;
font-size: 2rem;
margin-bottom: 12px;
padding-left: 40px;
background-image: url(svg/ico/ico-dino.svg);
background-repeat: no-repeat;
background-size: 30px;
background-position: 4px 4px;
}
.c-dino-list__item--cat {
background-image: url(svg/ico/ico-cat.svg);
background-size: 26px;
background-position: 4px 2px;
}
.c-dino-footer__text {
font-size: 21px;
font-size: 2.1rem;
font-weight: 500;
margin-bottom: 24px;
color: #292f33;
}
.ico-search-nav {
width: 20px;
height: 20px;
}
.ico-search-nav--label-right {
float: left;
margin-right: 6px;
}
/* icons using background images SVG */
.ico-twitter-bg {
float: left;
width: 42px;
height: 42px;
background-size: 42px;
background-image: url(svg/ico/ico-twitter-actual-34-34.svg);
}
.ico-facebook-bg {
float: left;
width: 42px;
height: 42px;
background-size: 42px;
background-image: url(svg/ico/ico-facebook-actual-34_34.svg);
}
.ico-instagram-bg {
float: left;
width: 42px;
height: 42px;
background-size: 42px;
background-image: url(svg/ico/ico-instagram-34-34.svg.svg);
}
.ico-youtube-bg {
float: left;
width: 42px;
height: 42px;
background-size: 42px;
background-image: url(svg/ico/ico-youtube-actual-34-34.svg);
}
.ico-linkedin-bg {
float: left;
width: 42px;
height: 42px;
background-size: 42px;
background-image: url(svg/ico/ico-linkedin-actual-34-34.svg);
}
.ico-social--lrg {
width: 40px !important;
height: 40px !important;
}
.ico-twitter {
width: 34px;
height: 34px;
fill: #55ACEE;
margin-top: 2px;
margin-right: 6px;
}
@media (min-width: 46.25em) {
.ico-twitter--right {
float: right;
margin-top: 0;
margin-right: 0;
margin-left: 6px;
}
}
.ico-facebook {
width: 34px;
height: 34px;
fill: #3B5998;
margin-top: 2px;
margin-right: 6px;
}
@media (min-width: 46.25em) {
.ico-facebook--right {
float: right;
margin-top: 0;
margin-right: 0;
margin-left: 6px;
}
}
.ico-linkedin {
width: 34px;
height: 34px;
fill: #007BB6;
margin-top: 2px;
margin-right: 6px;
}
@media (min-width: 46.25em) {
.ico-linkedin--right {
float: right;
margin-top: 0;
margin-right: 0;
margin-left: 6px;
}
}
.ico-external-link {
width: 19px;
height: 18px;
fill: #666;
vertical-align: bottom;
margin-right: 2px;
}
.ico-avatar {
width: 70px;
height: 70px;
fill: #54a3d8;
}
.ico-avatar--small {
width: 45px;
height: 45px;
}
.ico-alert {
width: 24px;
height: 24px;
fill: #666666;
}
.ico-alert--right {
float: right;
}
.ico-alert--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-alert--left {
float: left;
display: inline;
}
.ico-alert--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-alert.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-alert.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-dashboard {
width: 24px;
height: 24px;
fill: #666666;
}
.ico-dashboard--right {
float: right;
}
.ico-dashboard--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-dashboard--left {
float: left;
display: inline;
}
.ico-dashboard--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-dashboard.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-dashboard.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-help {
width: 24px;
height: 24px;
fill: #666666;
}
.ico-help--right {
float: right;
}
.ico-help--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-help--left {
float: left;
display: inline;
}
.ico-help--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-help.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-help.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-inbox {
width: 24px;
height: 24px;
fill: #666666;
}
.ico-inbox--right {
float: right;
}
.ico-inbox--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-inbox--left {
float: left;
display: inline;
}
.ico-inbox--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-inbox.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-inbox.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-search {
width: 24px;
height: 24px;
fill: #666666;
}
.ico-search--right {
float: right;
}
.ico-search--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-search--left {
float: left;
display: inline;
}
.ico-search--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-search.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-search.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-send {
width: 24px;
height: 24px;
fill: #666666;
}
.ico-send--right {
float: right;
}
.ico-send--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-send--left {
float: left;
display: inline;
}
.ico-send--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-send.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-send.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-menu {
width: 100%;
height: 100%;
fill: #666666;
}
.ico-menu--right {
float: right;
}
.ico-menu--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-menu--left {
float: left;
display: inline;
}
.ico-menu--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-menu.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-menu.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-menu-my-acc {
width: 38px;
height: 38px;
fill: #666666;
}
.ico-menu-my-acc--right {
float: right;
}
.ico-menu-my-acc--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-menu-my-acc--left {
float: left;
display: inline;
}
.ico-menu-my-acc--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-menu-my-acc.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-menu-my-acc.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-delete {
width: 24px;
height: 24px;
fill: #666666;
cursor: pointer;
}
.ico-delete--right {
float: right;
}
.ico-delete--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-delete--left {
float: left;
display: inline;
}
.ico-delete--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-delete.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-delete.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-delete--small {
width: 12px;
height: 12px;
fill: #cccccc;
margin-top: 5px;
}
.ico-delete--small--right {
float: right;
}
.ico-delete--small--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-delete--small--left {
float: left;
display: inline;
}
.ico-delete--small--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-delete--small.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-delete--small.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-delete--white {
width: 12px;
height: 12px;
fill: #FFF;
}
.ico-delete--white--right {
float: right;
}
.ico-delete--white--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-delete--white--left {
float: left;
display: inline;
}
.ico-delete--white--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-delete--white.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-delete--white.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-delete--right {
float: right;
margin-right: 0;
margin-left: 12px;
}
.ico-delete--red {
fill: #ff7979;
}
.ico-success {
width: 24px;
height: 24px;
fill: #666666;
fill: #16cbbe;
}
.ico-success--right {
float: right;
}
.ico-success--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-success--left {
float: left;
display: inline;
}
.ico-success--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-success.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-success.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-success--green {
fill: #16cbbe;
}
.ico-services {
width: 24px;
height: 24px;
fill: #666666;
}
.ico-services--right {
float: right;
}
.ico-services--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-services--left {
float: left;
display: inline;
}
.ico-services--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-services.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-services.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-services--hover {
fill: #fff;
}
.ico-apps {
width: 24px;
height: 24px;
fill: #666666;
}
.ico-apps--right {
float: right;
}
.ico-apps--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-apps--left {
float: left;
display: inline;
}
.ico-apps--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-apps.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-apps.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-apps--hover {
fill: #fff;
}
.ico-back-link {
width: 24px;
height: 24px;
fill: #666666;
fill: #ff5892;
}
.ico-back-link--right {
float: right;
}
.ico-back-link--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-back-link--left {
float: left;
display: inline;
}
.ico-back-link--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-back-link.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-back-link.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-settings {
width: 24px;
height: 24px;
fill: #666666;
}
.ico-settings--right {
float: right;
}
.ico-settings--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-settings--left {
float: left;
display: inline;
}
.ico-settings--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-settings.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-settings.not-desktop-feature {
display: none;
opacity: 0;
}
}
.ico-settings--hover {
fill: #fff;
}
.ico-drop-down {
width: 24px;
height: 24px;
fill: #666666;
}
.ico-drop-down--right {
float: right;
}
.ico-drop-down--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-drop-down--left {
float: left;
display: inline;
}
.ico-drop-down--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-drop-down.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-drop-down.not-desktop-feature {
display: none;
opacity: 0;
}
}
.services-pr-trigger--active .ico-drop-down, .services-journo-trigger--active .ico-drop-down, .open .ico-drop-down {
display: none;
}
@media (min-width: 1152px) {
.ico-drop-down.not-desktop-feature {
display: none;
}
}
.ico-drop-up {
width: 24px;
height: 24px;
fill: #666666;
display: none;
}
.ico-drop-up--right {
float: right;
}
.ico-drop-up--right-with-label {
float: right;
display: inline;
margin-left: 5px;
}
.ico-drop-up--left {
float: left;
display: inline;
}
.ico-drop-up--left-with-label {
float: left;
display: inline;
margin-right: 5px;
}
.ico-drop-up.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.ico-drop-up.not-desktop-feature {
display: none;
opacity: 0;
}
}
.services-pr-trigger--active .ico-drop-up, .services-journo-trigger--active .ico-drop-up, .open .ico-drop-up {
display: inline;
}
@media (min-width: 1152px) {
.services-pr-trigger--active .ico-drop-up.not-desktop-feature, .services-journo-trigger--active .ico-drop-up.not-desktop-feature, .open .ico-drop-up.not-desktop-feature {
display: none;
}
}
.ico-close {
width: 20px;
height: 20px;
margin-left: 4px;
float: right;
display: inline;
fill: #999;
}
.ico-close--fixed-bottom-right {
position: absolute;
bottom: 4px;
right: 4px;
}
.ico-tool-search {
width: 18px;
height: 18px;
fill: #666666;
margin-top: 8px;
margin-left: 4px;
margin: auto 0;
position: absolute;
top: 0;
bottom: 0;
left: 5px;
}
.ico-tool-search + span {
display: none;
}
@media (min-width: 1152px) {
.ico-tool-search.large-break {
margin-right: 4px;
}
.ico-tool-search.large-break + span {
display: inline;
}
}
@media (min-width: 71.875em) {
.ico-tool-search:not(.large-break) {
margin-right: 4px;
}
.ico-tool-search:not(.large-break) + span {
display: inline;
}
}
@media (min-width: 550px) {
.ico-tool-search.small-break {
margin-right: 4px;
}
.ico-tool-search.small-break + span {
display: inline;
}
}
.ico-sort {
width: 15px;
height: 19px;
fill: #666;
}
.ico-facebook {
float: left;
margin-right: 4px;
width: 30px;
height: 30px;
}
.ico-facebook__box {
fill: #3B5998;
}
.ico-facebook__cutout {
fill: #fff;
}
.ico-linkedin {
float: left;
margin-right: 4px;
width: 30px;
height: 30px;
}
.ico-linkedin__box {
fill: #007BB6;
}
.ico-linkedin__cutout {
fill: #fff;
}
.ico-googleplus {
float: left;
margin-right: 4px;
width: 30px;
height: 30px;
}
.ico-googleplus__box {
fill: #DC4E41;
}
.ico-googleplus__cutout {
fill: #fff;
}
.ico-twitter {
float: left;
margin-right: 4px;
width: 30px;
height: 30px;
}
.ico-twitter__box {
fill: #55ACEE;
}
.ico-twitter__cutout {
fill: #fff;
}
.ico-youtube {
float: left;
margin-right: 4px;
width: 30px;
height: 30px;
}
.ico-youtube__box {
fill: #E62d27;
}
.ico-youtube__cutout {
fill: #fff;
}
.ico-instagram {
float: left;
margin-right: 4px;
width: 30px;
height: 30px;
}
.ico-instagram__cutout {
fill: #fff;
}
.ico-pinterest {
float: left;
margin-right: 4px;
width: 30px;
height: 30px;
}
.ico-pinterest__cutout {
fill: #fff;
}
.ico-wikipedia {
float: left;
margin-right: 4px;
width: 30px;
height: 30px;
}
.ico-wikipedia__cutout {
fill: #fff;
}
.ico-tumblr {
float: left;
margin-right: 4px;
width: 30px;
height: 30px;
}
.ico-tumblr__cutout {
fill: #fff;
}
.ico-snapchat {
float: left;
margin-right: 4px;
width: 30px;
height: 30px;
}
.ico-snapchat__cutout {
fill: #fff;
}
.ico-social--small {
width: 22px;
height: 22px;
}
.ico-social--tiny {
width: 18px;
height: 18px;
}
.ico-avatar-new {
float: left;
width: 26px;
height: 31px;
margin-right: 6px;
}
.ico-avatar-group {
float: left;
width: 30px;
height: 34px;
margin-right: 6px;
}
.ico-padlock {
float: left;
width: 42px;
height: 54px;
}
.js-trigger--hover .ico-services {
fill: #fff;
}
.ico-sub-level-100 {
float: left;
width: 150px;
height: 150px;
}
.ico-tool-downarrow-select {
float: left;
margin: auto 0;
top: 0;
bottom: 0;
}
/* ===== SEARCH AUTOCOMPLETE =====================================================
Author: Simon Allin | 2016 |
========================================================================== */
/* DOCUMENT INFORMATION
-for use on pages to navigate
*/
/* ==========================================================================
component specific tools ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.suggestionLoaded.search-suggestion {
opacity: 1;
height: auto;
}
.search-suggestion {
-webkit-transition: all 0.4s ease;
-khtml-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-ms-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
opacity: 0;
}
.animate.ng-enter, .animate.ng-leave {
/* position: relative;
display: block;
overflow: hidden;
text-overflow: clip;
white-space:nowrap;*/
-webkit-transition: all 0.4s ease;
-khtml-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-ms-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
opacity: 0;
}
.animate.ng-enter-active, .animate.ng-leave-active {
opacity: 1;
}
.radio-label {
display: inline-block;
vertical-align: middle;
margin-right: 1%;
}
.radio-input {
display: inline-block;
vertical-align: middle;
}
.searchFor {
color: #F6358A;
}
.c-divider {
margin-bottom: 26px;
border-top: 2px solid #fff;
}
.c-search-drop__search-term {
font-weight: 300;
}
.c-search-drop__group {
margin-bottom: 26px;
padding-right: 26px;
}
.c-search-drop__group--right {
padding-right: 0;
}
.c-search-drop__group--3-col {
float: left;
padding-right: 0;
margin-right: 26px;
width: webkit-calc((100% - ( 26px ) * 2) / 3);
width: -moz-calc((100% - ( 26px ) * 2) / 3);
width: calc((100% - ( 26px ) * 2) / 3);
}
.c-search-drop__group--no-margin-right {
margin-right: 0;
}
.c-search-drop__group-title {
margin-bottom: 10px;
font-size: 24px;
font-size: 2.4rem;
}
.c-search__no-results {
padding: 26px;
font-size: 24px;
font-size: 2.4rem;
}
.c-search__no-results--bold {
font-weight: 700;
}
.c-search-drop__close {
position: absolute;
right: 0;
width: 25px;
height: 25px;
background-image: url(svg/ico/ico-close.svg);
background-repeat: no-repeat;
background-position: right 0 center;
background-size: 25px;
padding-right: 40px;
font-size: 20px;
font-size: 2rem;
outline: 0;
}
.c-search-drop__count {
color: #999;
}
.c-search-drop__row-group {
border-top: 1px solid #DBDEE1;
border-bottom: 1px solid #DBDEE1;
}
.c-search-drop__col {
overflow-y: auto;
}
.c-search-drop__row {
margin-bottom: 0px;
padding-top: 9px;
padding-bottom: 9px;
font-size: 15px;
font-size: 1.5rem;
font-weight: 500;
list-style-type: none;
list-style-position: outside;
border-bottom: 1px solid #ececec;
}
.c-search-drop__row:last-of-type {
border-bottom: 0;
}
.c-search-drop__row-subtext {
display: block;
margin-top: 3px;
color: #666;
}
@media (min-width: 1024px) {
.c-search-drop__row--2-col {
float: left;
width: webkit-calc((100% - 26px ) / 2);
width: -moz-calc((100% - 26px ) / 2);
width: calc((100% - 26px ) / 2);
margin-right: 26px;
}
}
.c-search-drop__row--2-col:nth-of-type(even) {
margin-right: 0;
}
.c-search-drop__row--keyboard-control {
cursor: pointer;
}
.c-search-drop__row--keyboard-control.kb-active {
-webkit-transition: all 0.1s ease-in;
-khtml-transition: all 0.1s ease-in;
-moz-transition: all 0.1s ease-in;
-ms-transition: all 0.1s ease-in;
-o-transition: all 0.1s ease-in;
transition: all 0.1s ease-in;
padding-right: 8px;
padding-left: 8px;
background: #f8f8f8;
border-left: 3px solid #666;
}
.c-search-drop__row--keyboard-control.kb-active.c-search-drop__row--mo {
border-left-color: #ff5892;
}
.c-search-drop__row--keyboard-control.kb-active.c-search-drop__row--moc {
border-left-color: #54a3d8;
}
.c-search-drop__row--keyboard-control.kb-active.c-search-drop__row--feature {
border-left-color: #ff9f6f;
}
.c-search-drop__row--indent {
padding-left: 28px;
}
.search {
position: relative;
width: 100%;
line-height: 1;
}
.search__close {
position: fixed;
top: 10px;
right: 10px;
font-size: 4rem;
cursor: pointer;
}
.search__close:after {
float: right;
content: "✖";
color: gray;
}
@media (min-width: 768px) {
.search__close {
position: static;
}
}
.search__input {
color: #737373;
font-weight: 300;
letter-spacing: -0.5px;
}
.search__wrapper--dashboard {
background: #fff;
border: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 1;
border: solid 3px #a3a3a3;
margin-bottom: 40px;
}
.search-autocomplete {
max-height: 650px;
overflow-y: auto;
border-right: 1px dotted #999999;
padding-bottom: 30px;
}
.search-autocomplete--dashboard {
padding-top: 30px;
padding-left: 30px;
}
@media (min-width: 768px) {
.search-autocomplete {
float: left;
display: inline;
width: 35%;
}
}
.search-suggestion {
padding-bottom: 26px;
padding-left: 26px;
width: 100%;
max-height: 100%;
overflow-y: auto;
position: relative;
}
.search-suggestion--dashboard {
padding-top: 30px;
padding-left: 30px;
}
@media (min-width: 768px) {
.search-suggestion {
float: left;
display: inline;
width: 65%;
}
}
.search-suggestion__list {
margin-bottom: 15px;
}
.search-suggestion__list-item {
display: inline;
padding-right: 12px;
margin-top: 2px;
margin-right: 7px;
margin-bottom: 2px;
margin-left: 0px;
color: #666;
position: relative;
}
.search-suggestion__list-item:after {
content: url(svg/mcd/ico-arrow-right-content-path.svg);
position: absolute;
width: 9px;
height: 16px;
right: 0;
top: 1px;
}
.search-suggestion__list-item:last-child {
padding-right: 0;
}
.search-suggestion__list-item:last-child:after {
content: "";
}
.search-suggestion__link {
display: block;
padding-top: 2px;
padding-right: 12px;
padding-left: 20px;
margin-top: 2px;
margin-right: 9px;
margin-bottom: 2px;
margin-left: 0px;
}
@media (min-width: 550px) {
.search-suggestion__link {
position: relative;
display: inline-block;
padding-top: 0;
padding-right: 12px;
padding-left: 0;
}
.search-suggestion__link:after {
content: "|";
position: absolute;
color: #B1B1B1;
right: 0;
top: 0;
}
.search-suggestion__link:last-child {
padding-right: 0;
}
.search-suggestion__link:last-child:after {
content: "";
}
}
.search-suggestion__link--keyword {
font-size: 16px;
font-size: 1.6rem;
}
.search-suggestion__link-title {
font-size: 15px;
font-size: 1.5rem;
}
.search-suggestion__link-group {
display: block;
padding-top: 5px;
}
@media (min-width: 550px) {
.search-suggestion__link-group {
padding-top: 0;
display: inline;
}
}
@media (min-width: 768px) {
.search-results {
float: right;
display: inline;
width: 70%;
}
}
.tool-bar__pagination--block {
float: none;
}
/* ===== FOLDERS & LISTS ====================================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-component for folders and lsts in menus
+------+ +------+ +------+
| | | | | |
+------+ +------+ +------+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* dropdown width config */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-folders-lists {
font-size: 1.6rem;
margin-left: 0;
padding-left: 0;
font-family: mada;
}
.c-folders-lists li {
list-style: none;
list-style-image: none;
}
.c-folders-lists__item {
margin-bottom: 12px;
}
.c-folders-lists__item-link {
display: block;
padding-left: 38px;
background-repeat: no-repeat;
background-size: 26px;
background-position: 0 5px;
color: #333;
}
.c-folders-lists__item-link:hover {
text-decoration: none;
}
.c-folders-lists__item-link--folder {
background-image: url(svg/ico/ico-folder.svg);
}
.c-folders-lists__item-link--folder.s-fav {
background-image: url(svg/ico/ico-folder-fav.svg);
}
.c-folders-lists__item-link--pl {
background-image: url(svg/ico/ico-list-pl.svg);
}
.c-folders-lists__item-link--fl {
background-image: url(svg/ico/ico-list-fl.svg);
}
.c-folders-lists-search > input {
padding: 18px 12px 18px 48px;
background-color: #e7e7e7;
background-image: url(svg/ico/ico-nav-search-dark.svg);
background-repeat: no-repeat;
background-size: 20px;
background-position: left 15px top 18px;
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
font-weight: 500;
color: #333;
border: none;
}
@media (max-width: 46.24em) {
.c-folders-lists-search > input {
width: 100%;
}
}
@media (min-width: 46.25em) {
.c-folders-lists-search > input {
width: 300px;
}
}
.c-folders-lists-search > input::-webkit-input-placeholder {
color: #333;
}
.c-folders-lists-search > input:-moz-placeholder {
color: #333;
}
.c-folders-lists-search > input::-moz-placeholder {
color: #333;
}
.c-folders-lists-search > input:-ms-input-placeholder {
color: #333;
}
.c-folders-lists-search > input:focus {
outline: none;
}
.c-folders-lists-search__v-all {
display: inline-block;
height: 55px;
background-color: #666;
color: #FFF;
}
.c-folders-lists-search__v-all:hover {
text-decoration: none;
}
input[type=checkbox] {
width: auto;
margin-right: 10px;
}
.modal-form__element, .unsub-form__element, .base-form__element {
margin-bottom: 20px;
}
.modal-form__element--last, .unsub-form__element--last, .base-form__element--last {
margin-bottom: 0;
}
.rs-form {
*zoom: 1;
padding-bottom: 15px;
}
.rs-form:before, .rs-form:after {
content: " ";
display: table;
}
.rs-form:after {
clear: both;
}
.rs-input__text {
height: 35px;
padding: 8px;
float: left;
display: inline;
font-family: "Mada", Arial, sans-serif;
font-size: 22px;
font-size: 2.2rem;
width: webkit-calc(100% - 45px);
width: -moz-calc(100% - 45px);
width: calc(100% - 45px);
}
@media (min-width: 1152px) {
.rs-input__text {
width: webkit-calc(100% - 75px);
width: -moz-calc(100% - 75px);
width: calc(100% - 75px);
}
}
.filter-input {
width: 100%;
height: 100%;
padding: 0px;
display: block;
border: none;
}
.filter-input:focus {
outline: 0;
}
.filter-input-wrapper {
height: auto;
border-width: 2px;
border-radius: 3px;
border-color: #ccc;
padding-top: 10px;
padding-bottom: 10px;
margin-bottom: 12px;
font-size: 17px;
font-size: 1.7rem;
}
.c-checkbox {
height: auto;
width: 100%;
margin-bottom: 12px;
position: relative;
display: inline-block;
line-height: 1.3 !important;
}
.c-checkbox:last-of-type {
margin-bottom: 0;
}
.c-checkbox input[type=checkbox] {
display: none;
}
.c-checkbox input[type=checkbox] + label span {
-webkit-transition: border 0.2s;
-khtml-transition: border 0.2s;
-moz-transition: border 0.2s;
-ms-transition: border 0.2s;
-o-transition: border 0.2s;
transition: border 0.2s;
position: absolute;
left: 0;
width: 18px;
height: 18px;
border: 2px solid #DDD;
border-radius: 2px;
}
.c-checkbox input[type=checkbox] + label span:before {
display: block;
width: 19px;
height: 19px;
text-align: center;
line-height: 19px;
content: " ";
}
.c-checkbox input[type=checkbox] + label:hover span {
border-color: #767676;
}
.c-checkbox input[type=checkbox]:checked + label span {
border: 2px solid #00A0DD;
background: #00A0DD;
border-radius: 2px;
}
.c-checkbox input[type=checkbox]:checked + label span:before {
content: "";
background-image: url(svg/Material/check-tick-white.svg);
color: #FFF;
margin-left: -3px;
margin-top: -3px;
}
.c-checkbox input[type=checkbox]:indeterminate + label span {
border: 2px solid #767676;
}
.c-checkbox input[type=checkbox]:indeterminate + label span:before {
content: "";
border-top: 1px solid #666;
width: 10px;
height: 10px;
margin: 8px auto 0 auto;
}
.c-checkbox--inline {
width: auto;
display: inline-block;
}
.c-checkbox-row {
*zoom: 1;
margin-bottom: 6px;
}
.c-checkbox-row:before, .c-checkbox-row:after {
content: " ";
display: table;
}
.c-checkbox-row:after {
clear: both;
}
.c-checkbox-row:last-of-type {
margin-bottom: 0;
}
.c-checkbox-label {
padding-left: 23px;
line-height: 1.3 !important .c-checkbox-label --x;
line-height-width: webkit-calc(100% - 20px);
line-height-width: -moz-calc(100% - 20px);
line-height-width: calc(100% - 20px);
}
.c-checkbox-label--large {
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
}
.base-form__label {
font-family: "Mada", Arial, sans-serif;
font-size: 18px;
font-size: 1.8rem;
margin-bottom: 6px;
}
.base-form__input {
width: 100%;
padding-top: 12px;
padding-right: 18px;
padding-bottom: 12px;
padding-left: 18px;
font-family: "Mada", Arial, sans-serif;
font-size: 24px;
font-size: 2.4rem;
font-weight: 300;
border: solid 2px #DDDDDD;
}
.base-form__textarea textarea {
height: 200px;
margin-bottom: 20px;
}
.base-form__select {
width: 100%;
padding-top: 12px;
padding-right: 18px;
padding-bottom: 12px;
padding-left: 18px;
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
font-weight: 300;
border: solid 2px #DDDDDD;
}
.c-range {
margin-top: 16px;
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
margin-left: 4px;
}
.c-range__label {
position: relative;
text-align: right;
float: left;
width: webkit-calc((100% - 4px) / 4);
width: -moz-calc((100% - 4px) / 4);
width: calc((100% - 4px) / 4);
}
.c-range__label:after {
position: absolute;
content: "";
width: 2px;
height: 10px;
background-color: #666;
right: 0;
top: -12px;
}
@media (max-width: 46.24em) {
.c-range__label--increment {
color: #fff;
}
}
.input-range {
-webkit-appearance: none;
width: 100%;
}
.input-range:focus {
outline: none;
}
.input-range:focus::-webkit-slider-runnable-track {
background: #d9d9d9;
}
.input-range:focus::-ms-fill-lower {
background: #b3b3b3;
}
.input-range:focus::-ms-fill-upper {
background: #d9d9d9;
}
.input-range::-webkit-slider-runnable-track {
background: #e6e6e6;
height: 7px;
border: none;
}
.input-range::-moz-range-track {
background: #e6e6e6;
height: 7px;
border: none;
}
.input-range::-ms-track {
background: #e6e6e6;
height: 7px;
border: none;
color: transparent;
}
.input-range::-ms-fill-lower {
background: #cccccc;
border: none;
}
.input-range::-ms-fill-upper {
background: #e6e6e6;
border: none;
}
.input-range::-webkit-slider-thumb {
height: 18px;
width: 10px;
background: #b3b3b3;
cursor: pointer;
border: none;
-webkit-appearance: none;
margin-top: -5.5px;
}
.input-range::-moz-range-thumb {
height: 18px;
width: 10px;
background: #b3b3b3;
cursor: pointer;
border: none;
border-radius: 0;
border: none;
}
.input-range::-ms-thumb {
height: 18px;
width: 10px;
background: #b3b3b3;
cursor: pointer;
border: none;
margin-top: 0;
}
/* ===== Feature Box =============================================
Author: Ed Patrick | August 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
- Used for styling list information in panels
¦ +~~~~~~~~~~~~~~+
¦ +~~~~~~~~~~~~~~+
¦ +~~~~~~~~~~~~~~+
*/
.c-feature-box {
padding: 24px;
margin-bottom: 24px;
background-color: #e6e6e6;
color: #333;
}
.c-feature-box--blue {
border-left: 3px solid #54a3d8;
}
.c-feature-box--pink {
border-left: 3px solid #ff5892;
}
/* ===== PRICING TABLE ================================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-component for pricing table
+-------------------------------+
| ~ | ~ | ~ | ~ | | ~ |
+-------------------------------+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-pricing-table {
font-size: 2.1rem;
font-family: "SurtRegular", Trebuchet MS, Arial, sans-serif;
font-weight: 400;
background: #FFF;
padding: 24px;
text-align: left;
}
@media (min-width: 61.25em) {
.c-pricing-table {
padding: 48px;
}
}
.c-pricing-table--shadow {
box-shadow: 0 32px 44px 0 rgba(51, 71, 91, 0.12);
}
.c-pricing-table--padding-none {
padding: 0;
}
.c-pricing-table--font-large {
font-size: 18px;
font-size: 1.8rem;
}
/* pricing table row */
.c-pricing-table__rh {
font-size: 18px;
font-size: 1.8rem;
font-weight: 700;
}
/* pricing table row */
.c-pricing-table__r {
display: block;
width: 100%;
border-bottom: 1px solid #eaeaec;
}
.c-pricing-table__r:last-of-type {
border-bottom: none;
}
/* pricing table row cell */
.c-pricing-table__rd {
padding-top: 12px;
padding-bottom: 12px;
padding-right: 12px;
/* ico modifiers */
}
.c-pricing-table__rd--ico {
padding-left: 36px;
background-repeat: no-repeat;
background-position: left center;
}
.c-pricing-table__rd--ico-tick {
background-image: url(svg/ico/ico-circle-tick.svg);
background-size: 30px;
}
.c-pricing-table__rd--ico-tick-blue {
background-image: url(svg/ico/ico-circle-tick--blue.svg);
background-size: 30px;
}
.c-pricing-table__rd--ico-plus {
background-image: url(svg/ico/ico-circle-plus.svg);
background-size: 30px;
}
.c-pricing-table__rd--ico-plus-drk-grey {
background-image: url(svg/ico/ico-circle-plus--drk-grey.svg);
}
.c-pricing-table__rd--ico-clock {
background-image: url(svg/ico/ico-circle-clock.svg);
background-size: 30px;
}
.c-pricing-table__rd--ico-play {
background-image: url(svg/ico/ico-circle-play.svg);
background-size: 30px;
}
.c-pricing-table__rd--ico-pa {
background-image: url(svg/ico/ico-prw-promo-pa.svg);
background-size: 30px;
}
.c-pricing-table__rd--ico-search {
background-image: url(svg/ico/ico-mcd-search.svg);
background-size: 31px;
background-position: 2px center;
}
.c-pricing-table__rd--ico-list {
background-image: url(svg/ico/ico-mcd-lists.svg);
background-size: 31px;
}
.c-pricing-table__rd--ico-import {
background-image: url(svg/ico/ico-priv-con-import-2.svg);
background-size: 28px;
}
.c-pricing-table__rd--ico-dist {
background-image: url(svg/ico/ico-dist-compose.svg);
background-size: 26px;
background-position: 2px center;
}
.c-pricing-table__rd--ico-tweets {
background-image: url(svg/ico/ico-mcd-tweets.svg);
background-size: 26px;
background-position: left center;
}
.c-pricing-table__rd--ico-opps {
background-image: url(svg/ico/ico-mcd-opps.svg);
background-size: 25px;
background-position: 3px center;
}
.c-pricing-table__rd--ico-large {
background-size: 26px;
}
/* ===== PRICING TABLE ================================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-component for pricing table
+-------------------------------+
| ~ | ~ | ~ | ~ | | ~ |
+-------------------------------+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-benefits {
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
/* ico modifiers */
}
/* pricing table row */
.c-benefits__li {
display: block;
width: 100%;
padding-top: 12px;
padding-bottom: 12px;
padding-right: 12px;
}
.c-benefits__li--ico {
padding-left: 46px;
background-repeat: no-repeat;
background-position: left center;
}
.c-benefits__li--ico-plus {
background-image: url(svg/ico/ico-circle-plus.svg);
background-size: 30px;
}
/* pricing table row cell */
.c-pricing-table__cost {
text-align: right;
font-size: 60px;
font-size: 6rem;
font-weight: 700;
align-items: baseline;
}
.c-pricing-table__cost-pound {
font-size: 23px;
font-size: 2.3rem;
font-weight: 400;
}
.c-pricing-table__cost-label {
font-size: 20px;
font-size: 2rem;
font-weight: 300;
}
/* ---------------------------------------------------------------------
ResponseSource logo system
1) SETUP
2) LOGOS
--------------------------------------------------------------------- */
.rs-footer {
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: normal;
font-size: 15px;
font-size: 1.5rem;
background: #333;
}
.rs-footer ul {
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: 1px dotted #999;
}
@media (min-width: 768px) {
.rs-footer ul {
border-bottom: none;
}
}
.rs-footer ul li {
margin-bottom: 5px;
}
.rs-footer ul li a {
color: #FFF;
font-size: 112%;
text-decoration: none;
}
@media (min-width: 768px) {
.rs-footer__section {
float: left;
display: inline;
width: webkit-calc(33.3333333333% - 10px);
width: -moz-calc(33.3333333333% - 10px);
width: calc(33.3333333333% - 10px);
}
.rs-footer__section--4-cols {
width: webkit-calc(25% - 20px);
width: -moz-calc(25% - 20px);
width: calc(25% - 20px);
}
.rs-footer__section:not(first-of-type), .rs-footer__section:not(last-of-type) {
margin-right: 5px;
margin-left: 5px;
}
.rs-footer__section:last-of-type {
float: right;
}
}
.rs-footer__section p {
font-size: 93%;
}
.rs-footer__section:last-of-type ul {
border-bottom: none;
}
.rs-footer__section--tel {
text-align: center;
}
@media (min-width: 768px) {
.rs-footer__section--tel {
text-align: left;
float: right;
display: inline;
}
}
.rs-footer__section--tel .phone {
display: block;
margin: 7px 0px;
text-decoration: none;
font-family: "Mada", Arial, sans-serif;
font-size: 160%;
color: #666;
font-weight: 500;
}
.rs-footer__section--tel .phone:hover {
text-decoration: none;
}
.rs-footer__section--tel p {
margin: 6px 0 0 0;
color: gray;
}
.rs-footer__section--FR {
padding-top: 10px;
}
.rs-footer__section--FR .phone span {
font-size: 8px;
font-size: 0.8rem;
}
.rs-footer__section--strapline a {
display: block;
vertical-align: middle;
}
@media (min-width: 768px) {
.rs-footer__section--strapline {
width: 49%;
float: left;
display: inline;
}
}
.rs-footer__title {
display: block;
padding-top: 24px;
margin-bottom: 12px;
color: white;
font-size: 25px;
font-size: 2.5rem;
font-weight: 500;
}
.rs-footer--legal {
padding-top: 30px;
padding-bottom: 30px;
padding-top: 30px;
background-color: white;
}
.rs-footer__telephone {
float: right;
display: inline;
color: #333;
text-decoration: none;
}
.rs-footer__telephone--login {
color: #666;
text-decoration: none;
}
.rs-footer__email {
float: right;
display: inline;
color: #333;
text-decoration: none;
}
/* ===================
FOOTER MOBILE LOGOS
=================== */
body.set_width nav, body.set_width .footer.one {
min-width: 1080px;
}
.wrapper--FE {
padding: 0 4%;
width: 990px;
margin: 0 auto;
}
@media (min-width: 768px) {
.wrapper--4-cols .footer__section--support {
width: 27%;
}
.wrapper--4-cols .footer__section--twitter {
width: 23%;
}
.wrapper--4-cols .footer__section--facebook {
width: 25%;
}
.wrapper--4-cols .footer__section--dwpub {
width: 21%;
}
}
@media (min-width: 1152px) {
.wrapper {
width: 1026px; /* 1140px - 10% for margins */
margin: 0 auto;
}
}
/*
#FE .wrapper { width: auto;
margin: 0 auto; }
*/
/* ===== HERO PANEL =========================================================
Author: Simon Allin | Jul 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for hero panels
+~~~~~~~~~~~~~~+
¦ Img ¦
¦ Title ¦
¦ Date ¦
+~~~~~~~~~~~~~~+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-hero {
padding-top: 48px;
padding-bottom: 48px;
background: #666;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
z-index: 0;
}
.c-hero--white {
background: #FFF;
}
.c-hero--cover-img {
background-size: cover;
background-position: center center;
padding-bottom: 0;
}
/* modifier to ensure min height */
.c-hero--min-height-350 {
height: 350px;
min-height: 350px;
}
@media (max-width: 61.24em) {
.c-hero--min-height-350 {
height: auto;
}
}
.c-hero--min-height-500 {
height: 500px;
min-height: 500px;
}
@media (max-width: 61.24em) {
.c-hero--min-height-500 {
height: auto;
}
}
.c-hero--min-height-250\@wide {
height: auto;
}
@media (min-width: 81.25em) {
.c-hero--min-height-250\@wide {
height: 250px;
min-height: 250px;
}
}
.c-hero--min-height-700 {
height: 600px;
min-height: 600px;
padding-top: 0;
}
@media (max-width: 61.24em) {
.c-hero--min-height-700 {
height: auto;
}
}
@media (max-height: 800px) {
.c-hero--min-height-700 {
height: 500px;
min-height: 500px;
}
}
.c-hero--min-height-150 {
height: 150px;
min-height: 150px;
}
@media (max-width: 61.24em) {
.c-hero--min-height-150 {
height: auto;
}
}
.c-hero--cover-rs {
background-color: transparent;
background-image: url(svg/covers/rs/RS-homepage-image-1.svg);
background-size: cover;
background-position: center center;
}
.c-hero--cover-rs-2 {
background-image: url(svg/covers/rs/RS-homepage-image-2.svg);
background-size: cover;
background-position: center center;
}
.c-hero--cover-rs-3 {
background: url(img/covers/rs/compressed/rs-home-cover-1.jpg) no-repeat center center;
background-position: center center;
}
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min--moz-device-pixel-ratio: 2), screen and (-moz-min-device-pixel-ratio: 2), screen and (-o-min-device-pixel-ratio: 2/1), screen and (min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
.c-hero--cover-rs-3 {
background: url(img/covers/rs/compressed/rs-home-cover-1@2x.jpg) no-repeat center center;
background-size: cover;
}
}
.c-hero--cover-rs-4 {
background: url(img/covers/rs/compressed/rs-home-cover-4.jpg) no-repeat center center;
background-position: center center;
}
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min--moz-device-pixel-ratio: 2), screen and (-moz-min-device-pixel-ratio: 2), screen and (-o-min-device-pixel-ratio: 2/1), screen and (min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
.c-hero--cover-rs-4 {
background: url(img/covers/rs/compressed/rs-home-cover-4@2x.jpg) no-repeat center center;
background-size: cover;
}
}
.c-hero--cover-rs-1 {
background-color: transparent;
background-image: url(svg/covers/rs/RS-homepage-image-1.svg);
background-position: center center;
}
.c-hero--cover-rs-left-portal {
background-color: transparent;
background-image: url(svg/covers/rs/RS-thank-you-page.svg);
background-position: center center;
}
.c-hero--cover-prw {
background: url(img/covers/prw/compressed/rs-home-cover-6.jpg) no-repeat center center;
background-position: center center;
}
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min--moz-device-pixel-ratio: 2), screen and (-moz-min-device-pixel-ratio: 2), screen and (-o-min-device-pixel-ratio: 2/1), screen and (min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
.c-hero--cover-prw {
background: url(img/covers/prw/compressed/rs-home-cover-6@2x.jpg) no-repeat center center;
background-size: cover;
}
}
.c-hero--cover-pricing {
background-image: url(img/covers/rs/compressed/rs-pricing-cover.jpg);
}
.c-hero--cover-pro {
background: url(img/covers/pro/compressed/pro-home-cover.jpg) no-repeat center center;
}
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min--moz-device-pixel-ratio: 2), screen and (-moz-min-device-pixel-ratio: 2), screen and (-o-min-device-pixel-ratio: 2/1), screen and (min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
.c-hero--cover-pro {
background: url(img/covers/pro/compressed/pro-home-cover@2x.jpg) no-repeat center center;
background-size: cover;
}
}
.c-hero--cover-pro-2 {
background: url(img/covers/pro/compressed/pro-home-cover-2.jpg) no-repeat center center;
}
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min--moz-device-pixel-ratio: 2), screen and (-moz-min-device-pixel-ratio: 2), screen and (-o-min-device-pixel-ratio: 2/1), screen and (min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
.c-hero--cover-pro-2 {
background: url(img/covers/pro/compressed/pro-home-cover-2@2x.jpg) no-repeat center center;
background-size: cover;
}
}
.no-flexbox .c-heading--hero {
position: relative;
left: 0;
}
.c-hero__heading-container {
padding-left: 0;
width: 100%;
text-align: center;
}
@media (min-width: 46.25em) {
.c-hero__heading-container {
text-align: left;
}
}
@media (min-width: 46.25em) {
.c-hero__heading-container--narrow {
padding-left: 20%;
}
}
@media (min-width: 81.25em) {
.c-hero__heading-container--narrow {
padding-left: 50%;
}
}
@media (max-width: 46.24em) {
.c-hero__heading-container--left-narrow {
max-width: 80%;
}
}
@media (min-width: 46.25em) {
.c-hero__heading-container--left-narrow {
max-width: 50%;
}
}
.c-img-gallery {
border-top: 2px solid #ccc;
padding-top: 24px;
}
.c-img-gallery__item {
float: left;
background: #FFF;
padding: 6px;
margin-bottom: 24px;
}
.c-img-gallery__item:last-of-type {
margin-bottom: 0;
}
.u-link--white-underline {
color: #FFF;
}
.u-link--white-underline:hover {
color: #FFF;
text-decoration: underline;
}
/* ===== FEATURED CONTENT POST =============================================
Author: Ed Patrick | May 2017 |
========================================================================== */
/* /////////////////////////////////////////////////////////////
************* Deprecated - Legacy version **************
///////////////////////////////////////////////////////////// */
/* DOCUMENT INFORMATION
-Use for styling individual featured posts
+~~~~~~~~~~~~~~+
¦ Img ¦
¦ Title ¦
¦ Date ¦
+~~~~~~~~~~~~~~+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* featured news slices / setup flex parent */
.c-fc-news__block--flex-parent {
position: relative;
display: flex;
flex-wrap: wrap;
}
/* creating break flex class name options */
@media (max-width: 34.365em) {
.c-fc-news__block--break-flex\@mobile {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 46.24em) {
.c-fc-news__block--break-flex\@tablet {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 52.49em) {
.c-fc-news__block--break-flex\@medium {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 61.24em) {
.c-fc-news__block--break-flex\@desktop {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 63.99em) {
.c-fc-news__block--break-flex\@desktop-medium {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 71.865em) {
.c-fc-news__block--break-flex\@desktop-wide {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 81.24em) {
.c-fc-news__block--break-flex\@wide {
display: block;
float: none;
width: 100%;
}
}
@media (max-width: 34.365em) {
.c-fc-news__block--break-flex\@mobile .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 46.24em) {
.c-fc-news__block--break-flex\@tablet .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 52.49em) {
.c-fc-news__block--break-flex\@medium .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 61.24em) {
.c-fc-news__block--break-flex\@desktop .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 63.99em) {
.c-fc-news__block--break-flex\@desktop-medium .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 71.865em) {
.c-fc-news__block--break-flex\@desktop-wide .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
@media (max-width: 81.24em) {
.c-fc-news__block--break-flex\@wide .c-fc-news__slice {
display: block;
float: none;
border-right: none;
margin-right: 0;
padding-right: 0;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #cccccc;
width: 100% !important;
}
}
.no-flexbox .c-fc-news__block {
overflow: hidden;
}
/* set the slices to flex */
.c-fc-news__block--4-col .c-fc-news__slice, .c-fc-news__block--3-col .c-fc-news__slice, .c-fc-news__block--2-col .c-fc-news__slice {
box-sizing: border-box;
float: left;
}
.c-fc-news__block--2-col .c-fc-news__slice {
width: webkit-calc((100% - 24px ) / 2);
width: -moz-calc((100% - 24px ) / 2);
width: calc((100% - 24px ) / 2);
flex: 0 0 auto;
}
.c-fc-news__block--3-col .c-fc-news__slice {
width: webkit-calc((100% - 24px ) / 3);
width: -moz-calc((100% - 24px ) / 3);
width: calc((100% - 24px ) / 3);
flex: 0 0 auto;
}
.c-fc-news__block--4-col .c-fc-news__slice {
width: webkit-calc((100% - 36px ) / 4);
width: -moz-calc((100% - 36px ) / 4);
width: calc((100% - 36px ) / 4);
flex: 0 0 auto;
}
.c-fc__row-divider {
width: 100%;
flex: 0 0 auto;
border-bottom: 1px solid #cccccc;
margin-bottom: 12px;
}
.c-fc__row-divider--no-margin {
border-bottom: none;
margin-bottom: 0;
}
.no-flexbox .c-fc__row-divider {
clear: both;
}
/* no-fex fallback for IE < 11 */
.no-flex .c-fc-news__block--4-col .c-fc-news__slice {
float: left;
width: webkit-calc((100% - 36px ) / 4);
width: -moz-calc((100% - 36px ) / 4);
width: calc((100% - 36px ) / 4);
}
.no-flex .c-fc-news__block--3-col .c-fc-news__slice {
float: left;
width: webkit-calc((100% - 36px ) / 3);
width: -moz-calc((100% - 36px ) / 3);
width: calc((100% - 36px ) / 3);
}
.no-flex .c-fc-news__block--2-col .c-fc-news__slice {
float: left;
width: webkit-calc((100% - 36px ) / 2);
width: -moz-calc((100% - 36px ) / 2);
width: calc((100% - 36px ) / 2);
}
/* class name to out on each featured item */
.c-fc-item {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: -0.4px;
font-weight: 500;
/* horizontal option */
/* make inverted dark option for featured interview */
}
.c-fc-item--horizontal .c-fc-item__img {
width: webkit-calc(43% - 12px);
width: -moz-calc(43% - 12px);
width: calc(43% - 12px);
margin-right: 12px;
margin-bottom: 12px;
float: left;
}
.c-fc-item--horizontal .c-fc-item__content {
float: left;
width: webkit-calc(100% - (43% + 12px ));
width: -moz-calc(100% - (43% + 12px ));
width: calc(100% - (43% + 12px ));
}
.c-fc-item--horizontal.c-fc-item--interview .c-fc-item__img {
width: webkit-calc(30% - 12px);
width: -moz-calc(30% - 12px);
width: calc(30% - 12px);
}
.c-fc-item--horizontal.c-fc-item--interview .c-fc-item__content {
width: webkit-calc(100% - (30% + 12px ));
width: -moz-calc(100% - (30% + 12px ));
width: calc(100% - (30% + 12px ));
}
.c-fc-item--trans {
background-color: rgba(0, 0, 0, 0.4);
padding: 24px;
}
.c-fc-item--dark {
color: #333;
background-color: #EEEEEE;
padding: 24px;
}
.c-fc-item--light {
color: #333;
background-color: #FFF;
padding: 24px;
}
.c-fc-item--no-padding {
padding: 0;
}
.c-fc-item--card {
width: 75%;
padding: 24px;
padding-right: 24px !important;
}
.c-fc-item--card > img {
width: 100%;
}
.c-fc-item--blog-card {
border-right: none;
}
.c-fc-item--outline {
padding: 24px !important;
border: 2px solid #EEEEEE !important;
}
.c-fc-item--outline-drk-grey {
border: 2px solid #666;
}
.c-fc-item--orange-outline {
border: 3px solid #ff9f6f;
-webkit-box-shadow: 0px 0px 28px -2px rgba(0, 0, 0, 0.39);
-moz-box-shadow: 0px 0px 28px -2px rgba(0, 0, 0, 0.39);
box-shadow: 0px 0px 28px -2px rgba(0, 0, 0, 0.39);
}
.c-fc-item--rs-brand {
background: transparent;
}
.c-fc-item--persona {
color: #0085B2;
height: 100%;
}
/* quote wrapper */
.c-fc-item--matchup {
padding: 24px;
flex-grow: 1;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
flex-direction: column;
}
/* quote text including top quote mark */
.c-fc-item__top {
flex-grow: 1;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
flex-direction: column;
flex-grow: 1;
}
.c-fc-item__bottom {
min-height: 120px;
bottom: 0;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
align-items: center;
justify-content: center;
min-height: 50px;
}
.c-fc-item__bottom .c-fc-item__bottom__link {
bottom: 0;
height: auto;
max-height: 100px;
}
.c-fc-item--blog-card .c-fc-item__title, .c-fc-item--outline .c-fc-item__title {
font-size: 20px;
font-size: 2rem;
}
.c-fc-item__title--line-h {
line-height: 1.6;
}
.c-fc-item {
font-family: "futura PT";
}
@media (max-width: 34.365em) {
.c-fc-item--break-horizontal\@mobile .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 46.24em) {
.c-fc-item--break-horizontal\@tablet .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 52.49em) {
.c-fc-item--break-horizontal\@medium .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 61.24em) {
.c-fc-item--break-horizontal\@desktop .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 63.99em) {
.c-fc-item--break-horizontal\@desktop-medium .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 71.865em) {
.c-fc-item--break-horizontal\@desktop-wide .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 81.24em) {
.c-fc-item--break-horizontal\@wide .c-fc-item__img {
float: none;
width: 100%;
}
}
@media (max-width: 34.365em) {
.c-fc-item--break-horizontal\@mobile .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 46.24em) {
.c-fc-item--break-horizontal\@tablet .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 52.49em) {
.c-fc-item--break-horizontal\@medium .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 61.24em) {
.c-fc-item--break-horizontal\@desktop .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 63.99em) {
.c-fc-item--break-horizontal\@desktop-medium .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 71.865em) {
.c-fc-item--break-horizontal\@desktop-wide .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (max-width: 81.24em) {
.c-fc-item--break-horizontal\@wide .c-fc-item__content {
float: none;
width: 100%;
}
}
@media (min-width: 46.25em) {
.c-fc-item--also-read .c-fc-item__img {
float: left;
max-width: 35%;
margin-bottom: 0;
margin-right: 12px;
}
}
.c-fc-item__img {
margin-bottom: 12px;
}
.c-fc-item__img img {
width: 100%;
height: auto;
}
.c-fc-item__title {
color: #333;
display: block;
margin-top: 0;
margin-bottom: 12px;
font-family: "Mada", Arial, sans-serif;
font-size: 19px;
font-size: 1.9rem;
letter-spacing: -0.4px;
font-weight: 700;
}
.c-fc-item__title > a {
color: #333;
}
.c-fc-item__title > a:hover {
color: #ff5892;
transition: 0s;
}
.c-fc-item__title--main {
font-size: 28px;
font-size: 2.8rem;
}
.c-fc-item--persona .c-fc-item__title,
.c-fc-item--rs-brand .c-fc-item__title {
font-size: 26px;
font-size: 2.6rem;
color: #1067b0;
}
.c-fc-item--rs-brand .c-fc-item__title {
color: #FFF;
}
.c-fc-item__desc {
margin-bottom: 12px;
}
.c-fc-item__text {
margin-top: 0;
margin-bottom: 24px;
font-family: "Mada", Arial, sans-serif;
}
.c-fc-item--persona .c-fc-item__text,
.c-fc-item--rs-brand .c-fc-item__text {
color: #1067b0;
font-size: 19px;
font-size: 1.9rem;
font-weight: 500;
}
.c-fc-item--rs-brand .c-fc-item__text {
color: #FFF;
}
.c-fc-item__svg {
width: 110px;
height: 110px;
margin: 0 auto 12px auto;
background-image: url(svg/ico/ico-product--MCD.svg);
background-repeat: no-repeat;
}
.c-fc-item__svg--JES {
background-image: url(svg/ico/ico-product--JES.svg);
}
.c-fc-item__svg--PRW {
background-image: url(svg/ico/ico-product--PRW.svg);
}
.c-fc-item__svg--MJ {
background-image: url(svg/ico/ico-product--MJ.svg);
}
.c-fc-item__persona-svg {
width: 140px;
height: 140px;
margin: 0 auto 12px auto;
background-image: url(svg/ico/ico-persona-1.svg);
background-repeat: no-repeat;
}
.c-fc-item__persona-svg--1 {
background-image: url(svg/ico/ico-persona-digital-marketer.svg);
}
.c-fc-item__persona-svg--2 {
background-image: url(svg/ico/ico-persona-staff-journo.svg);
}
.c-fc-item__persona-svg--3 {
background-image: url(svg/ico/ico-persona-freelance.svg);
}
.c-fc-item__persona-svg--4 {
background-image: url(svg/ico/ico-persona-pr-pro.svg);
}
.c-fc-item__date {
font-family: "Mada", Arial, sans-serif;
font-size: 13px;
font-size: 1.3rem;
color: #666;
margin-bottom: 12px;
}
.c-fc-item__label {
display: inline-block;
color: #666;
padding: 12px;
background-color: #cccccc;
}
.c-fc-item__label:hover {
color: #ff5892;
transition: 0s;
}
.strip-tape {
padding: 4px;
background-color: #ccc;
}
.c-feature-quote {
position: relative;
width: 80%;
margin-left: auto;
margin-right: auto;
font-family: "Mada", Arial, sans-serif;
font-size: 22px;
font-size: 2.2rem;
letter-spacing: -0.4px;
font-weight: 400;
text-align: center;
padding: 24px;
color: #1067b0;
background: #FFF;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}
@media (max-width: 34.365em) {
.c-feature-quote--stacked\@mobile {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 46.24em) {
.c-feature-quote--stacked\@tablet {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 52.49em) {
.c-feature-quote--stacked\@medium {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 61.24em) {
.c-feature-quote--stacked\@desktop {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 63.99em) {
.c-feature-quote--stacked\@desktop-medium {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 71.865em) {
.c-feature-quote--stacked\@desktop-wide {
width: 100%;
margin-bottom: 48px;
}
}
@media (max-width: 81.24em) {
.c-feature-quote--stacked\@wide {
width: 100%;
margin-bottom: 48px;
}
}
/* By default, we tilt all our images -2 degrees */
.c-p-grid-item {
transition: all 0.2s ease-in-out;
-webkit-transform: rotate(-1deg);
-moz-transform: rotate(-1deg);
}
.c-p-grid-item--shadow {
-webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
-moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
}
/* Rotate all even images 2 degrees */
.c-p-grid-item:nth-child(even) {
-webkit-transform: rotate(1deg);
-moz-transform: rotate(1deg);
}
/* Don't rotate every third image, but offset its position */
.c-p-grid-item:nth-child(4n), .c-p-grid-item--no-rotate {
-webkit-transform: none;
-moz-transform: none;
position: relative;
top: -3px;
}
/* Rotate every fifth image by 5 degrees and offset it */
.c-p-grid-item:nth-child(5n) {
-webkit-transform: rotate(2deg);
-moz-transform: rotate(2deg);
position: relative;
right: 3px;
}
/* Keep default rotate for every eighth, but offset it */
.c-p-grid-item:nth-child(8n) {
position: relative;
top: 8px;
right: 5px;
}
/* Keep default rotate for every eleventh, but offset it */
.c-p-grid-item:nth-child(11n) {
position: relative;
top: 3px;
left: -5px;
}
.c-p-grid-item:hover {
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
position: relative;
z-index: 5;
filter: grayscale(1);
}
.c-p-grid-item:hover a {
text-decoration: none;
}
.c-p-grid-item--no-hover:hover {
-webkit-transform: none;
-moz-transform: none;
filter: none;
}
.c-p-grid-item-hover:hover {
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
position: relative;
z-index: 5;
filter: grayscale(1);
}
.c-p-grid-item-hover:hover a {
text-decoration: none;
}
.c-p-grid-item--cut:nth-of-type(n+4) {
margin-bottom: 0 !important;
}
.c-p-grid-item__img {
width: 100%;
height: 200px;
overflow: hidden;
}
.c-p-head {
width: 100%;
background: #f4f4f4;
padding: 48px;
margin-bottom: 48px;
}
.c-p-head__img {
min-width: 250px;
margin-right: 24px;
}
.c-p-head__img img {
max-width: 100%;
max-height: 100%;
border: 2px solid #666;
}
.c-p-head__data {
width: 100%;
}
.c-p-text {
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
line-height: 1.5;
}
.c-p-list {
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
line-height: 1.5;
margin-bottom: 24px;
}
.c-p-list ul {
list-style: initial;
margin: initial;
padding: 0 0 0 24px;
}
.c-p-list li {
display: list-item;
margin-bottom: 12px;
}
/* ===== PROMO PANEL ========================================================
Author: Simon Allin / Ed Patrick | 2017 |
========================================================================== */
/* COMPONENT --------------------------- */
.c-color-row {
background-color: #666;
padding-top: 96px;
padding-bottom: 96px;
}
.c-color-row--light-grey {
background-color: #EEEEEE;
}
.c-color-row--v-light-grey {
background: #f7f7f7;
}
.c-color-row--mid-padd {
padding-top: 48px;
padding-bottom: 48px;
}
.c-color-row--light-grey-border {
background: #FFF;
border: 3px solid #e7e7e7;
}
.c-color-row--mid-padd {
padding-top: 48px;
padding-bottom: 48px;
}
.c-section {
padding-bottom: 24px;
margin-bottom: 24px;
}
.c-section--v-delim {
border-bottom: 2px solid #d1d1d1;
}
.c-section-row {
padding-top: 96px;
padding-bottom: 96px;
}
.c-section-row--w-header {
padding-top: 15px;
}
.c-section-row--grey {
background: #666;
}
.c-section-row--v-light-grey {
background-color: #f7f7f7;
}
.c-section-row--light-grey {
background-color: rgb(238, 238, 238);
}
.c-section-row--tuna {
background-color: #c1c2c7;
}
.c-section-row--blue {
background-color: #1067b0;
}
.c-section-row--ai-brand-blue {
background-color: #161E36;
}
.c-section-row--mid-padd {
padding-top: 48px;
padding-bottom: 48px;
}
.c-section-row--white {
background-color: #FFF;
}
.c-section-row--hide-overflow {
overflow: hidden;
}
.c-section-row__header {
float: none;
display: block;
height: auto;
margin-bottom: 96px;
z-index: auto;
background-color: transparent;
}
.c-rs-brand-section__header {
margin-bottom: 24px;
}
.c-feature-box {
padding: 24px;
}
.c-feature-box--white {
background: #FFF;
}
/* new branding sections */
.c-section-row-arrow {
position: relative;
}
.c-section-row-arrow::before {
content: "";
position: absolute;
background: #FFF;
left: 50%;
width: 50px;
height: 50px;
-webkit-transform: translateX(-50%) rotate(45deg);
transform: translateX(-50%) rotate(45deg);
top: -39px;
}
.c-section-row-arrow--grey-arrow::before {
background: #eeeeee;
}
.c-section-row-arrow--ai-blue-arrow::before {
background: #161E36;
}
.c-section-row-arrow--v-light-grey-arrow::before {
background: #f7f7f7;
}
.c-section-row-arrow--blue-arrow::before {
background: #1067b0;
}
.c-section-row-arrow--tuna::before {
background: #c1c2c7;
}
.c-section-row-arrow--pb-split {
position: relative;
}
.c-section-row-arrow--pb-split::before {
position: absolute;
content: "";
width: 0;
height: 0;
left: 50%;
top: 0;
border: 34px solid transparent;
border-top: 0;
border-bottom: 34px solid #e0eafd;
border-right: 17px;
transform: rotate(180deg);
z-index: 10;
}
.c-section-row-arrow--pb-split::after {
position: absolute;
content: "";
width: 0;
height: 0;
right: 50%;
top: 0;
border: 34px solid transparent;
border-top: 0;
border-bottom: 34px solid #94c0ff;
border-left: 17px;
-webkit-transform: translateX(-50%) rotate(45deg);
transform: rotate(90deg);
transform: scale(-1, -1);
z-index: 10;
}
@media (max-width: 46.24em) {
.c-section-row-arrow--pb-split::after {
border-bottom: 40px solid #e0eafd;
}
}
/* ===== PROMO JUMP NAV =====================================================
Author: Simonz | May 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for jump navigaitons on promopages
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~+
¦ ¦
¦ jump link ¦ jump link ¦ jump link ¦ jump link ¦
¦ ¦
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-jump-menu {
padding-top: 18px;
padding-bottom: 18px;
margin-left: 0;
padding-left: 0;
text-align: center;
}
.c-jump-menu li {
list-style: none;
list-style-image: none;
}
.c-jump-menu--ai-shadow {
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
z-index: 2;
position: relative;
}
.c-jump-menu__item {
width: auto;
display: inline-block;
margin-right: 24px;
margin-left: 24px;
color: #666;
font-size: 1.6rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 600;
text-transform: uppercase;
}
.c-jump-menu__item > a {
color: #666;
}
.c-jump-menu__item > a:hover {
border-bottom: 3px solid #666;
text-decoration: none;
}
.c-jump-menu--alt {
text-align: center;
margin-bottom: 24px;
}
.c-jump-menu--alt .c-jump-menu__item {
float: none;
display: inline-block;
margin-right: 24px;
font-size: 20px;
font-size: 2rem;
}
.c-jump-menu--alt .c-jump-menu__item > a {
color: #FFF;
}
.c-jump-menu--alt .c-jump-menu__item > a:hover {
text-decoration: none;
}
.c-jump-menu--alt-2 {
flex-direction: column;
flex-grow: 1;
border-top: 3px solid rgba(255, 255, 255, 0.35);
}
.c-jump-menu--alt-2 .c-jump-menu__item {
float: none;
display: inline-block;
margin-right: 24px;
font-size: 18px;
font-size: 1.8rem;
}
.c-jump-menu--alt-2 .c-jump-menu__item > a {
color: #fff;
}
.c-jump-menu-abs-prnt {
position: absolute;
bottom: 0;
width: 100%;
}
/* ===== XP CARD COMPONENT ================================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-component for universal cross site service navigaiton
+-------------------------------+
| ~ | ~ | ~ | ~ | | ~ |
+-------------------------------+
*/
/* ======================================================================
local settigns / mixins etc ////////////////////////////////////////// */
/* ======================================================================
component //////////////////////////////////////////////////////////// */
.c-xp-card {
border: 2px solid #d1d1d1;
padding: 24px;
}
.c-xp-card__img {
float: left;
width: 100px;
}
.c-xp-card__img > img {
width: 100%;
}
.c-xp-card__data {
float: left;
width: webkit-calc(100% - ( 100px + 24px ));
width: -moz-calc(100% - ( 100px + 24px ));
width: calc(100% - ( 100px + 24px ));
}
/* ===== RESULT SET =======================================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
- componenet for displaying sets of results
*/
/* ======================================================================
new search result set ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* master settings */
.c-rslt-set {
font-size: 1.6rem;
font-family: "Mada", Arial, sans-serif;
font-weight: 500;
color: #585858;
}
.c-rslt-set--enq-full {
font-size: 15px;
font-size: 1.5rem;
font-weight: 500;
}
.c-rslt-set--txt-lrg {
font-size: 18px;
font-size: 1.8rem;
}
.c-rslt-set--border-top {
border-top: 3px solid #e7e7e7;
}
/* row */
.c-rslt-set__r {
border-bottom: 1px solid #ccc;
}
.c-rslt-set__r--click {
cursor: pointer;
}
.c-rslt-set__r--click:hover {
background: #f8f8f8;
}
.c-rslt-set__r--selected {
background: #f1f1f1;
}
.c-rslt-set__r--selected:hover {
background: #f1f1f1;
}
/* row heading */
.c-rslt-set__rh {
font-size: 18px;
font-size: 1.8rem;
font-weight: 700;
}
/* row division */
.c-rslt-set__rd {
padding-top: 12px;
padding-bottom: 12px;
padding-right: 12px;
float: left;
/* for acc user list */
}
.c-rslt-set__rd--date-time {
width: 200px;
}
.c-rslt-set__rd--mo {
width: 30%;
}
.c-rslt-set__rd--title {
width: webkit-calc(100% - ( 30% + 200px ));
width: -moz-calc(100% - ( 30% + 200px ));
width: calc(100% - ( 30% + 200px ));
}
.c-rslt-set__rd--replies {
width: 30px;
}
.c-rslt-set__rd--usr-name {
width: 43%;
}
@media (max-width: 61.24em) {
.c-rslt-set__rd--usr-name {
float: none;
width: 100%;
}
}
.c-rslt-set__rd--usr-name-avatar {
padding-left: 42px;
background-image: url(svg/ico/avatar/ico-avatar-usr-list.svg);
background-repeat: no-repeat;
background-position: left center;
}
.c-rslt-set__rd--usr-email {
width: 43%;
}
@media (max-width: 61.24em) {
.c-rslt-set__rd--usr-email {
float: none;
width: 100%;
}
}
.c-rslt-set__rd--usr-cats {
width: 14%;
}
@media (max-width: 61.24em) {
.c-rslt-set__rd--usr-cats {
float: none;
width: 100%;
}
}
@media (max-width: 61.24em) {
.c-rslt-set--padd-lrg.c-rslt-set--break\@desktop .c-rslt-set__r {
padding-top: 12px;
}
.c-rslt-set--padd-lrg.c-rslt-set--break\@desktop .c-rslt-set__r:first-of-type {
border-bottom: 1px solid #ccc;
}
}
.c-rslt-set--padd-lrg.c-rslt-set--break\@desktop .c-rslt-set__rd {
padding-top: 0;
padding-bottom: 0;
margin-bottom: 12px;
}
@media (min-width: 61.25em) {
.c-rslt-set--padd-lrg.c-rslt-set--break\@desktop .c-rslt-set__rd {
padding-top: 24px;
padding-bottom: 24px;
margin-bottom: 0;
}
}
@media (max-width: 61.24em) {
.c-rslt-set--padd-lrg.c-rslt-set--break\@desktop .c-rslt-set__rd--usr-name-avatar {
padding-top: 12px;
padding-bottom: 12px;
}
}
.c-rslt-set--enq-full .c-rslt-set__rd {
padding-top: 17px;
padding-bottom: 17px;
float: left;
}
.c-rslt-set--enq-full .c-rslt-set__rd--title {
font-weight: 700;
}
.c-rslt-set--enq-full .c-rslt-set__rd--title-min-width {
min-width: 150px;
}
.c-rslt-set--enq-full .c-rslt-set__rd--date-time {
width: 130px;
}
.c-rslt-set--enq-full .c-rslt-set__rd--mo {
width: 20%;
}
.c-rslt-set--enq-full .c-rslt-set__rd--title {
width: webkit-calc(100% - ( 20% + 130px * 4));
width: -moz-calc(100% - ( 20% + 130px * 4));
width: calc(100% - ( 20% + 130px * 4));
}
.o-row__division {
font-size: 0;
display: inline-block;
width: 100%;
}
.o-rd-parent-break-setting {
width: 100%;
}
@media (min-width: 34.375em) {
.o-rd-parent-break-setting\@mobile .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@mobile .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@mobile .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@mobile .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@mobile .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@mobile .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@mobile .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@mobile .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@mobile .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@mobile .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 46.25em) {
.o-rd-parent-break-setting\@tablet .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@tablet .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@tablet .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@tablet .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@tablet .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@tablet .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@tablet .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@tablet .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@tablet .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@tablet .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 52.5em) {
.o-rd-parent-break-setting\@medium .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@medium .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@medium .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@medium .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@medium .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@medium .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@medium .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@medium .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@medium .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@medium .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 61.25em) {
.o-rd-parent-break-setting\@desktop .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@desktop .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@desktop .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@desktop .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@desktop .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@desktop .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@desktop .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@desktop .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@desktop .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@desktop .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 64em) {
.o-rd-parent-break-setting\@desktop-medium .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@desktop-medium .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 71.875em) {
.o-rd-parent-break-setting\@desktop-wide .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@desktop-wide .o-rd--10\/12 {
width: 83.3333333333%;
}
}
@media (min-width: 81.25em) {
.o-rd-parent-break-setting\@wide .o-rd--1\/12 {
width: 8.3333333333%;
}
.o-rd-parent-break-setting\@wide .o-rd--2\/12 {
width: 16.6666666667%;
}
.o-rd-parent-break-setting\@wide .o-rd--3\/12 {
width: 25%;
}
.o-rd-parent-break-setting\@wide .o-rd--4\/12 {
width: 33.3333333333%;
}
.o-rd-parent-break-setting\@wide .o-rd--5\/12 {
width: 41.6666666667%;
}
.o-rd-parent-break-setting\@wide .o-rd--6\/12 {
width: 50%;
}
.o-rd-parent-break-setting\@wide .o-rd--7\/12 {
width: 58.3333333333%;
}
.o-rd-parent-break-setting\@wide .o-rd--8\/12 {
width: 66.6666666667%;
}
.o-rd-parent-break-setting\@wide .o-rd--9\/12 {
width: 75%;
}
.o-rd-parent-break-setting\@wide .o-rd--10\/12 {
width: 83.3333333333%;
}
}
/* ===== SEARCH FACETS =======================================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
- Search column
- Compact filters
*/
/* ===== Mixins & variables =================================================
========================================================================== */
/* ===== Search column ======================================================
========================================================================== */
.c-search-col {
border-right: 2px solid #ccc;
}
.c-search-col__results {
padding-right: 0;
border-right: 0px transparent;
}
@media (min-width: 52.5em) {
.c-search-col__results {
border-right: 2px solid #ccc;
padding-right: 24px;
}
}
/* ===== Compact filters=====================================================
========================================================================== */
.c-s-f-compact__header {
padding-top: 10px;
padding-bottom: 12px;
width: 100%;
}
.c-s-f-compact__wrapper {
background-color: #FFF;
list-style-type: none;
overflow: hidden;
width: 100%;
overflow: visible;
}
.c-s-f-compact__wrapper > li {
display: inline-flex;
float: left;
}
.c-s-f-compact__wrapper > li:last-of-type {
padding-right: 0px;
margin-right: 0px;
}
.c-s-f-compact__groups {
font-size: 14px;
font-size: 1.4rem;
position: relative;
*zoom: 1;
}
.c-s-f-compact__groups:before, .c-s-f-compact__groups:after {
content: " ";
display: table;
}
.c-s-f-compact__groups:after {
clear: both;
}
.c-s-f-compact__groups .cat-group__heading {
border-bottom: 1px solid #b3b3b3;
font-family: "Mada", Arial, sans-serif;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: -0.4px;
font-weight: normal;
}
.c-s-f-compact__groups .cat-group__heading .heading {
height: 38px;
width: 90%;
padding: 8px;
display: inline-block;
}
.c-s-f-compact__groups .cat-group__heading .ico-minus-download, .c-s-f-compact__groups .cat-group__heading .ico-plus-download {
margin: 8px 0;
}
@media (min-width: 1024px) {
.c-s-f-compact__groups .cat-group__heading {
border-bottom: 1px solid #e7e7e7;
}
.c-s-f-compact__groups .cat-group__heading .ico-minus-download, .c-s-f-compact__groups .cat-group__heading .ico-plus-download {
margin-top: 10px;
margin-right: 8px;
margin-bottom: 6px;
float: right;
display: inline;
}
}
.c-s-f-compact__groups .cat-group__container {
overflow: hidden;
}
.c-s-f-compact__groups .cat-group__container.open {
overflow: hidden;
border-bottom: 1px solid #e7e7e7;
margin: 0;
padding: 0 12px 12px 12px;
}
.c-s-f-compact__groups .cat-group__container .checkbox, .c-s-f-compact__groups .cat-group__container .c-checkbox {
width: 100%;
padding: 0px;
font-family: "Mada", Arial, sans-serif;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: -0.4px;
font-weight: normal;
}
@media (min-width: 1024px) {
.c-s-f-compact__groups .cat-group__container {
margin-top: 0;
}
.c-s-f-compact__groups .cat-group__container .checkbox, .c-s-f-compact__groups .cat-group__container .c-checkbox {
display: block;
width: auto;
margin-top: 4px;
margin-right: 4px;
margin-left: 4px;
}
}
.c-s-f-compact__groups .cat-group__container:last-child .c-s-f-compact__groups .cat-group__container__container {
border-bottom: 0px;
}
.c-s-f-compact__groups .cat-group:last-child .c-s-f-compact__groups .cat-group__container {
border-bottom: 0px;
}
.c-s-f-compact__groups .filter-option {
width: 100%;
margin: 0;
}
.c-s-f-compact__facet {
border-bottom: 3px solid #e7e7e7;
}
.c-s-f-compact__facet:first-child {
border-top: 3px solid #e7e7e7;
}
.c-s-f-compact__facet--open {
border-color: #ccc;
}
.c-s-f-compact__facet-title {
font-weight: 700;
width: 100%;
*zoom: 1;
border: none;
background-color: transparent;
display: block;
padding: 12px;
}
.c-s-f-compact__facet-title:before, .c-s-f-compact__facet-title:after {
content: " ";
display: table;
}
.c-s-f-compact__facet-title:after {
clear: both;
}
.c-s-f-compact__facet-title--active {
border-bottom: 2px solid #e7e7e7;
}
.c-s-f-compact__facet-title > span {
float: left;
display: inline;
}
.c-s-f-compact__facet-title--count {
margin-left: 2px;
}
.c-s-f-compact__facet-title:hover {
cursor: pointer;
}
.c-s-f-compact__facet-title .material-icons {
margin-left: 5px;
float: right;
display: inline;
-webkit-transition: transform 0.2s;
-khtml-transition: transform 0.2s;
-moz-transition: transform 0.2s;
-ms-transition: transform 0.2s;
-o-transition: transform 0.2s;
transition: transform 0.2s;
}
.c-s-f-compact__facet-filters {
position: static;
}
@media (min-width: 1024px) {
.c-s-f-compact__facet-filters {
position: relative;
}
}
.c-s-f-compact__facet-filters__title {
font-weight: 700;
width: 100%;
*zoom: 1;
border: none;
background-color: transparent;
display: block;
padding: 12px;
background-color: #e6e6e6;
}
.c-s-f-compact__facet-filters__title:before, .c-s-f-compact__facet-filters__title:after {
content: " ";
display: table;
}
.c-s-f-compact__facet-filters__title:after {
clear: both;
}
.c-s-f-compact__facet-filters__title > span {
float: left;
display: inline;
}
.c-s-f-compact__facet-filters__title--count {
margin-left: 2px;
}
.c-s-f-compact__facet-filters__title:hover {
cursor: pointer;
}
.c-s-f-compact__facet-filters__title .material-icons {
margin-left: 5px;
float: right;
display: inline;
-webkit-transition: transform 0.2s;
-khtml-transition: transform 0.2s;
-moz-transition: transform 0.2s;
-ms-transition: transform 0.2s;
-o-transition: transform 0.2s;
transition: transform 0.2s;
}
.c-s-f-compact__facet-filters__container {
background-color: white;
*zoom: 1;
padding: 12px;
}
.c-s-f-compact__facet-filters__container:before, .c-s-f-compact__facet-filters__container:after {
content: " ";
display: table;
}
.c-s-f-compact__facet-filters__container:after {
clear: both;
}
.c-s-f-compact__facet-filters__container--import-match {
top: 41px;
z-index: 1;
width: 100%;
right: 0;
}
@media (min-width: 768px) {
.c-s-f-compact__facet-filters__container--import-match {
position: absolute;
width: 150%;
border-width: 2px 2px 2px 2px;
border-style: solid;
border-color: #cccccc;
padding: 18px;
}
}
@media (min-width: 1024px) {
.c-s-f-compact__facet-filters__container--import-match {
width: 100%;
}
}
@media (min-width: 1152px) {
.c-s-f-compact__facet-filters__container--import-match {
width: 150%;
}
}
.c-s-f-compact__facet-filters.open > .filter-option__title {
position: relative;
border-bottom: 0;
padding: 9px;
background-color: white;
}
.c-s-f-compact__facet-filters.open > .filter-option__title .material-icons {
-webkit-transform: rotate(180deg);
-khtml-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
.c-s-f-compact__facet-filters.open > .filter-option__container {
display: block;
}
@media (min-width: 768px) {
.c-s-f-compact__facet-filters.open > .filter-option__container {
z-index: 1;
visibility: visible;
opacity: 1;
margin-top: -2px;
}
}
.c-s-f-compact__facet-filters__item--inputtext {
margin-right: 6px;
margin-bottom: 10px;
float: left;
display: inline;
width: webkit-calc(100% - 65px);
width: -moz-calc(100% - 65px);
width: calc(100% - 65px);
}
@media (min-width: 768px) {
.c-s-f-compact__facet-filters__item--inputtext {
margin-bottom: auto;
}
}
@media (min-width: 768px) {
.c-s-f-compact__facet-filters__item--inputtext-features {
float: left;
display: inline;
width: 50%;
margin-bottom: auto;
}
}
.c-s-f-compact__facet-filters__item--inputtext input[type=text]:focus {
outline: none;
}
.c-s-f-compact__facet-filters__item--inputtext-w-padding {
padding: 6px;
}
.c-s-f-compact__facet-filters .material-icons--open:before {
content: "\e313";
}
.c-s-f-compact__facet-filters .c-checkbox {
width: 100%;
padding: 0px;
font-family: "Mada", Arial, sans-serif;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: -0.4px;
font-weight: normal;
}
.c-s-f-compact__facet-options {
font-family: "Mada", Arial, sans-serif;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: -0.4px;
font-weight: normal;
padding: 12px;
}
.panel-group {
max-height: 350px;
overflow-y: auto;
}
.panel-group .panel-open .cat-group__heading {
border-bottom: 0px;
}
@media (min-width: 1024px) {
.panel-group .panel-group {
width: 100%;
min-height: 400px;
max-height: 400px;
display: inline-block;
overflow-y: scroll;
overflow-x: hidden;
border-bottom: 1px solid #cccccc;
}
}
.material-icons.material-icons--open.material-icons--close {
-webkit-transform: rotate(180deg);
-khtml-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
/* ===== blocked content ====================================================
Author: Simon Allin | May 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for styling individual featured posts
+~~~~~~~~~~~~~~+
¦ Img ¦
¦ Title ¦
¦ Date ¦
+~~~~~~~~~~~~~~+
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-locked-content {
padding: 24px;
background: #264592;
}
.c-locked-content--rs {
background: #1067b0;
}
.c-locked-content__logo {
width: 155px;
height: 72px;
margin-bottom: 12px;
background-size: 100%;
}
.c-locked-content__logo--rs {
width: 90%;
max-width: 400px;
max-height: 61px;
}
@media (min-width: 71.875em) {
.c-locked-content__logo--rs {
height: 43px;
}
}
.c-locked-content__header {
background: none;
clear: none;
height: auto;
margin-bottom: 12px;
}
.c-locked-content__title {
font-size: 2.5rem;
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
line-height: 1;
color: #FFF;
margin-bottom: 12px;
}
.c-locked-content__sub-title {
font-size: 1.8rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 600;
line-height: 1;
color: #FFF;
}
.c-locked-content__list {
padding-left: 0;
margin-bottom: 24px;
}
.c-locked-content__list-item {
display: flex;
flex-direction: row;
align-items: center;
padding-top: 12px;
padding-bottom: 12px;
border-bottom: 2px solid #223d82;
font-size: 1.6rem;
font-family: "futura-pt-bold", Trebuchet MS, Arial, sans-serif;
font-weight: 700;
color: #FFF;
}
.c-locked-content__list-item:last-of-type {
border-bottom: none;
}
.c-locked-content__list-item--sub {
display: list-item;
list-style-type: disc;
list-style-position: outside;
margin-left: 22px;
padding-left: 0;
text-indent: -4px;
font-size: 1.6rem;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 600;
}
.c-locked-content__item-svg {
width: 28px;
margin-right: 12px;
}
.c-locked-content__item-svg > svg {
width: 28px;
height: 28px;
}
.c-locked-content__item-svg--small > svg {
height: 22px;
}
.c-locked-content__item-info {
width: calc(100% - (28px + 12px));
}
.c-locked-content__actions-row {
margin-bottom: 12px;
color: #FFF;
text-align: center;
font-size: 18px;
font-size: 1.8rem;
}
.c-locked-content__actions-row:last-of-type {
margin-bottom: none;
}
.c-locked-content__actions-row > a {
color: #FFF;
}
.c-locked-content__actions-row > a:hover {
text-decoration: underline;
transition: 0s;
color: #FFF;
}
.rs-feature-intro {
font-family: "Mada", Arial, sans-serif;
position: relative;
min-height: 400px;
padding-top: 40px;
padding-bottom: 40px;
border-bottom: 4px solid;
background: url(/css/site_core/img/backgrounds/hot_send_2016.jpg) center center;
background-size: cover;
}
.rs-feature-intro .wrapper {
position: relative;
}
.rs-feature-intro__panel {
box-sizing: border-box;
background: black;
background: rgba(0, 0, 0, 0.35);
font-size: 25px;
font-size: 2.5rem;
padding-top: 15px;
padding-right: 15px;
padding-bottom: 15px;
padding-left: 15px;
margin-bottom: 20px;
}
@media (min-width: 768px) {
.rs-feature-intro__panel {
padding-top: 40px;
padding-right: 20px;
padding-bottom: 40px;
padding-left: 20px;
margin-bottom: 0px;
}
}
@media (min-width: 768px) {
.rs-feature-intro__panel--left {
margin-right: 40px;
}
.rs-feature-intro__panel--2-col {
width: webkit-calc(50% - 40px);
width: -moz-calc(50% - 40px);
width: calc(50% - 40px);
float: left;
display: inline;
}
}
.rs-feature-intro__large-title {
font-weight: 700;
color: #fff;
font-size: 28px;
font-size: 2.8rem;
padding-top: 0;
margin-top: 0;
}
@media (min-width: 768px) {
.rs-feature-intro__large-title {
font-size: 36px;
font-size: 3.6rem;
padding-top: 10px;
padding-bottom: 10px;
margin-top: 10px;
margin-bottom: 34px;
}
}
.rs-feature-intro__title {
font-weight: 700;
margin: 0;
color: #fff;
font-size: 2.2rem;
}
@media (min-width: 768px) {
.rs-feature-intro__title {
font-size: 2.8rem;
}
}
.rs-feature-intro__info {
color: #fff;
font-size: 2rem;
line-height: 2.8rem;
margin-top: 10px;
margin-bottom: 10px;
}
@media (min-width: 768px) {
.rs-feature-intro__info {
font-size: 2.2rem;
line-height: 3rem;
margin-bottom: 20px;
}
}
.rs-feature-intro__more-link {
color: #fff;
}
/* ---------------------------------------------------------------------
Breadcrumb component
--------------------------------------------------------------------- */
/* DOCUMENT INFORMATION
-for simple breadcrumb navigation trail e.g.
Home > News > Category > Page Title
*/
.c-breadcrumb {
width: 100%;
}
.c-breadcrumb__item {
float: left;
margin-right: 6px;
padding-right: 12px;
position: relative;
list-style-type: none;
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
}
.c-breadcrumb__item:before {
display: none;
}
.c-breadcrumb__item--parent {
position: relative;
}
.c-breadcrumb__item--parent:after {
content: url(../../svg/ico-arrow-right-content-path.svg);
position: absolute;
width: 9px;
height: 12px;
right: 0px;
top: 1px;
}
.c-breadcrumb__item--parent:last-child {
padding-right: 0;
}
.c-breadcrumb__item--parent:last-child:after {
content: "";
}
.c-breadcrumb__link {
text-decoration: none;
padding-bottom: 6px;
}
.c-breadcrumb__link:hover {
border-bottom: 2px solid #ff5892;
}
/* ---------------------------------------------------------------------
#form | . = core class | -- modifiers
--------------------------------------------------------------------- */
.unsub-form__message {
font-family: "Mada", Arial, sans-serif;
font-size: 25px;
font-size: 2.5rem;
line-height: 28px;
border: 2px solid;
padding: 10px;
margin-bottom: 20px;
}
.unsub {
color: #333333;
font-size: 16px;
min-height: 100%;
}
.unsub-body {
background: #f7f7f7;
}
.unsub-form {
margin-top: 50px;
border: 1px solid #e7e7e7;
background: #fff;
padding: 40px;
}
@media (min-width: 768px) {
.unsub-form {
width: 50%;
margin-right: auto;
margin-left: auto;
}
}
.unsub-form__title {
margin-bottom: 30px;
}
.unsub-form__email {
margin-bottom: 30px;
}
.unsub-form__label {
font-family: "Mada", Arial, sans-serif;
font-size: 15px;
font-size: 1.5rem;
}
.unsub-form__input {
width: 100%;
padding-top: 12px;
padding-right: 18px;
padding-bottom: 12px;
padding-left: 18px;
font-family: "Mada", Arial, sans-serif;
font-size: 24px;
font-size: 2.4rem;
font-weight: 300;
border: solid 2px #DDDDDD;
}
.unsub-form__para {
font-family: "Mada", Arial, sans-serif;
font-size: 15px;
font-size: 1.5rem;
}
/* ---------------------------------------------------------------------
#TOOLBARS | .tool-bar = core class | -- modifiers
1) TOOLBAR
1.1) SHORT VERSION
1.2) FULL WIDTH VERSION
2) NO RESULTS
--------------------------------------------------------------------- */
.tool-bar {
*zoom: 1;
padding-bottom: 12px;
}
.tool-bar:before, .tool-bar:after {
content: " ";
display: table;
}
.tool-bar:after {
clear: both;
}
.tool-bar.sticky {
display: block;
position: fixed;
left: 0;
top: 0;
padding: 16px 5%;
background-color: white;
z-index: 3;
}
@media (min-width: 550px) {
.tool-bar.sticky {
top: 60px;
}
}
@media (min-width: 1024px) {
.tool-bar.sticky {
width: 100%;
}
}
.tool-bar.sticky .tool-bar__wrapper {
width: 100%;
max-width: 1300px;
margin: 0 auto;
}
@media (min-width: 1152px) {
.tool-bar.sticky .tool-bar__wrapper {
width: 95%;
padding-right: 20px;
padding-left: 20px;
}
}
.tool-bar.sticky {
width: 100%;
left: 0;
top: 0;
border-bottom: 2px solid #cccccc;
padding: 10px 20px;
}
@media (min-width: 550px) {
.tool-bar.sticky {
top: 0px;
}
}
.tool-bar.sticky .tool-bar__pagination--results {
margin-top: 0;
clear: none;
}
.tool-bar--full {
width: 100%;
display: block;
padding-top: 20px;
}
.tool-bar--full.sticky {
left: 0;
top: 0;
padding: 10px 20px;
border-bottom: 2px solid #cccccc;
}
@media (min-width: 550px) {
.tool-bar--full.sticky {
top: 0px;
}
}
@media (min-width: 1024px) {
.tool-bar--full.sticky {
left: 50%;
-webkit-transform: translateX(-50%);
-khtml-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
}
.tool-bar--no-underline {
border: none;
}
.tool-bar__button {
min-height: 38px;
padding: 6px 10px;
margin-right: 5px;
float: left;
border: none;
font-size: 15px;
font-size: 1.5rem;
font-weight: 500;
-webkit-transition: all 0.1s linear;
-khtml-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-ms-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
transition: all 0.1s linear;
border: 1px solid #b3b3b3;
color: #666;
}
.tool-bar__button:not(.tool-bar__button--disabled):hover, .tool-bar__button:not(.tool-bar__button--disabled):focus, .tool-bar__button:not(.tool-bar__button--disabled):active {
cursor: pointer;
border-color: gray;
color: black;
}
.tool-bar__button .input, .tool-bar__button .select {
-webkit-transition: all 0.1s linear;
-khtml-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-ms-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
transition: all 0.1s linear;
color: gray;
}
.tool-bar__button .input:hover, .tool-bar__button .input:focus, .tool-bar__button .input:active, .tool-bar__button .select:hover, .tool-bar__button .select:focus, .tool-bar__button .select:active {
color: black;
}
.tool-bar__button:hover {
text-decoration: none;
}
.tool-bar__button--disabled {
-webkit-opacity: 0.3;
-khtml-opacity: 0.3;
-moz-opacity: 0.3;
-ms-opacity: 0.3;
-o-opacity: 0.3;
opacity: 0.3;
cursor: not-allowed;
pointer-events: none;
}
.tool-bar__button--mo {
margin-bottom: 0;
}
.tool-bar__button--filter-menu {
font: 0/0 a;
text-shadow: none;
color: transparent;
background-image: url("");
background-repeat: no-repeat;
background-position: 50% 50%;
width: image-width(url(""));
height: image-height(url(""));
}
@media (min-width: 1024px) {
.tool-bar__button--filter-menu {
display: none;
}
}
.tool-bar__button--trigger {
float: right;
display: inline;
margin-right: 0;
}
.tool-bar__button.active {
background-color: #999999;
color: white;
border-color: #999999;
}
.tool-bar__button--right {
float: right;
margin-right: 0;
}
.tool-bar__button--replicate {
margin-right: 10px;
}
.tool-bar__button.not-desktop-feature {
display: block;
opacity: 1;
}
@media (min-width: 1152px) {
.tool-bar__button.not-desktop-feature {
display: none;
opacity: 0;
}
}
.tool-bar__filters {
*zoom: 1;
}
.tool-bar__filters:before, .tool-bar__filters:after {
content: " ";
display: table;
}
.tool-bar__filters:after {
clear: both;
}
@media (max-width: 46.24em) {
.tool-bar__filters {
width: 100%;
clear: both;
}
}
@media (min-width: 46.25em) {
.tool-bar__filters {
float: right;
width: auto;
}
}
.tool-bar__filters--folders {
width: 400px;
}
@media (min-width: 768px) {
.tool-bar__filters--single {
width: 200px;
margin-left: 8px;
}
}
@media (min-width: 46.25em) {
.tool-bar__filters-wrapper {
float: left;
width: 200px;
margin-right: 12px;
}
}
.tool-bar__filters-wrapper--input {
height: auto;
border-width: 2px;
border-radius: 3px;
border-color: #ccc;
padding-top: 10px;
padding-bottom: 10px;
margin-bottom: 12px;
}
.tool-bar__filters-wrapper--input > input {
line-height: 18px;
font-weight: 500;
color: #666;
}
.tool-bar__filters-wrapper--input-filter {
background-image: url(svg/ico/ico-filter.svg);
background-repeat: no-repeat;
background-position: left 4px center;
background-size: 18px;
padding-left: 25px;
line-height: 1.6;
}
.tool-bar__filters-wrapper--full {
width: 100%;
float: none;
display: block;
}
@media (min-width: 1024px) {
.tool-bar__filters-wrapper--full {
margin-left: 0px;
}
}
.tool-bar__filters-wrapper .select-label {
float: left;
display: inline;
color: #666;
width: 45px;
}
.tool-bar__filters-wrapper--select {
float: right;
display: inline;
width: webkit-calc(100% - 45px);
width: -moz-calc(100% - 45px);
width: calc(100% - 45px);
}
@media (min-width: 46.25em) {
.tool-bar--short .tool-bar__filters {
width: auto;
float: right;
}
}
@media (min-width: 46.25em) {
.tool-bar--full .tool-bar__filters {
width: auto;
float: right;
}
}
.tool-bar__pagination {
display: none;
margin-right: 5px;
}
@media (min-width: 550px) {
.tool-bar__pagination {
float: left;
display: inline;
}
}
@media (min-width: 550px) {
.tool-bar__pagination--right {
float: right;
margin-right: 0;
}
}
.tool-bar__pagination--new-line {
margin-top: 10px;
margin-right: 0px;
clear: both;
}
@media (min-width: 1024px) {
.tool-bar--full .tool-bar__pagination {
float: left;
display: inline;
}
}
@media (min-width: 550px) {
.tool-bar--mo .tool-bar__pagination {
float: right;
display: inline;
}
}
.tool-bar__tools {
*zoom: 1;
margin-bottom: 12px;
}
.tool-bar__tools:before, .tool-bar__tools:after {
content: " ";
display: table;
}
.tool-bar__tools:after {
clear: both;
}
@media (min-width: 46.25em) {
.tool-bar__tools {
width: auto;
float: left;
}
}
.tool-bar--alert-check {
float: right;
width: 150px;
margin-top: 4px;
}
@media (max-width: 46.24em) {
.tool-bar--alert-check {
float: right;
margin-top: 12px;
}
}
.tool-bar--folders {
display: block;
width: 100%;
margin-bottom: 12px;
}
@media (min-width: 46.25em) {
.tool-bar--folders {
float: right;
width: webkit-calc(100% - 200px);
width: -moz-calc(100% - 200px);
width: calc(100% - 200px);
margin-bottom: 0;
}
}
@media (min-width: 61.25em) {
.tool-bar--folders {
float: right;
width: webkit-calc(100% - 420px);
width: -moz-calc(100% - 420px);
width: calc(100% - 420px);
margin-bottom: 0;
}
}
@media (min-width: 61.25em) {
.tool-bar__pagination--folders {
max-width: 420px;
}
}
.no-results {
font-size: 26px;
font-size: 2.6rem;
text-align: center;
width: 75%;
clear: both;
margin: 25px auto;
}
.no-results--main {
display: none;
margin: 50px auto 80% auto;
}
@media (min-width: 1024px) {
.no-results--main {
display: block;
}
}
.no-results--filterbar {
display: block;
margin: 50px auto 80% auto;
}
@media (min-width: 1024px) {
.no-results--filterbar {
display: none;
}
}
.no-results--small {
font-size: 20px;
font-size: 2rem;
}
/* ---------------------------------------------------------------------
#POPUPZ | . = core class | -- modifiers
--------------------------------------------------------------------- */
.container.modal-form-container {
background-color: #ffffff;
padding: 0;
display: block;
}
@media (min-width: 550px) {
.container.modal-form-container {
max-width: 500px;
}
}
@media (min-width: 550px) {
.container.modal-form-container--select-entity-tool {
max-width: 700px;
}
}
@media (min-width: 550px) {
.container.modal-form-container--list-tool {
max-width: 800px;
}
}
@media (min-width: 550px) {
.container.modal-form-container--download-tool {
max-width: 800px;
}
}
.save-to-list--modal, .move-list, .modal-form {
padding-top: 20px;
padding-right: 20px;
padding-bottom: 20px;
padding-left: 20px;
}
.save-to-list__title--modal, .move-list__title, .modal-form__title {
font-size: 32px;
font-size: 3.2rem;
margin-bottom: 20px;
font-weight: 700;
}
.modal-form {
font-size: 16px;
font-size: 1.6rem;
color: #666;
margin-bottom: 0;
padding-top: 40px;
}
.modal-form-container {
height: auto;
}
.modal-form__input {
font-weight: 500;
font-size: 22px;
font-size: 2.2rem;
color: #666;
width: 100%;
padding-top: 12px;
padding-right: 18px;
padding-bottom: 12px;
padding-left: 18px;
font-family: "Mada", Arial, sans-serif;
font-size: 40px;
font-size: 4rem;
font-weight: 300;
border: solid 2px #DDDDDD;
}
.modal-form__input--add-folder {
width: 100%;
}
.modal-form__input--add-list {
width: 100%;
}
.modal-form__checkbox {
margin: 6px 4px 0 0;
}
.modal-form__body {
margin-bottom: 20px;
}
.move-list {
margin-bottom: 30px;
}
/* ===== SELECT DROPDOWN ====================================================
Author: Simon Allin | 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-description
+----------------------------+
| |
| ~~~~~~~~~~~~~~~~~~~~ |
| ~~~~~~~~~~~~~~~~~~~~ |
| ~~~~~~~~~~~~~~~~~~~~ |
| |
+----------------------------+
*/
/* requirements
needs to contain ico-labels
meeds to hold checkbox
2px border
rounded corners on first & last - interior == square
*/
/* new style for functional buttons */
.c-func-btn {
float: left;
border: 2px solid #ccc;
border-radius: 3px;
font-size: 15px;
font-size: 1.5rem;
font-weight: 500;
padding: 8px;
margin-right: 12px;
color: #666;
}
.c-func-btn--disabled {
-webkit-opacity: 0.3;
-khtml-opacity: 0.3;
-moz-opacity: 0.3;
-ms-opacity: 0.3;
-o-opacity: 0.3;
opacity: 0.3;
cursor: not-allowed;
pointer-events: all !important;
}
.c-func-btn--sml {
font-size: 12px;
font-size: 1.2rem;
font-weight: 700;
padding: 6px;
}
.c-func-btn--post-articles {
background-image: url(svg/mcd/ico_svg/article-grey-out.svg);
background-repeat: no-repeat;
background-position: 3px 3px;
background-color: #FFF;
border: 2px solid #CCC;
color: #666;
padding-left: 30px;
padding-top: 9px;
padding-bottom: 8px;
}
.c-func-btn--post-articles:hover {
background-color: #FFF;
}
.c-func-btn--post-tweets {
background-image: url(svg/mcd/ico_svg/ico-twitter-bird-actual-16-13.svg);
background-size: 20px;
background-repeat: no-repeat;
background-position: 5px 10px;
background-color: #FFF;
border: 2px solid #CCC;
color: #666;
padding-left: 30px;
padding-top: 9px;
padding-bottom: 8px;
}
.c-func-btn--w-icon-24 {
line-height: 24px;
}
.c-func-btn--ico-close {
background-image: url(svg/mcd/ico_svg/ico-x.svg);
background-position: left 8px top 12px;
background-repeat: no-repeat;
padding-left: 26px;
padding-top: 8px;
padding-bottom: 8px;
}
.c-func-btn--ico-next {
width: 35px;
height: 35px;
background-image: url(svg/mcd/ico_svg/ico-chevron-right.svg);
background-position: center;
padding-right: 22px;
padding-left: 9px;
background-repeat: no-repeat;
background-color: #FFF;
}
.c-func-btn--ico-next-sml {
padding: 4px;
background-size: 8px;
height: 20px;
width: 20px;
}
.c-func-btn--ico-prev {
width: 35px;
height: 35px;
background-image: url(svg/mcd/ico_svg/ico-chevron-left.svg);
background-position: center;
padding-left: 22px;
background-repeat: no-repeat;
background-color: #FFF;
}
.c-func-btn--ico-prev-sml {
padding: 4px;
background-size: 7px;
height: 20px;
width: 20px;
}
.c-func-btn--article-joined-left {
border-top-right-radius: 0;
border-right: 2px solid #ccc;
}
.c-func-btn--article-joined-mid {
margin-left: -3px;
border-radius: 0;
margin-right: 0;
border-right: 1px solid #ccc;
}
.c-func-btn--article-joined-right {
margin-left: -3px;
border-top-left-radius: 0;
border-left: 0;
}
.c-func-btn:hover {
color: #333;
text-decoration: none;
}
.c-func-btn:hover svg {
fill: #666;
}
.c-func-btn-group {
float: left;
border: 2px solid #ccc;
border-radius: 3px;
font-size: 15px;
font-size: 1.5rem;
font-weight: 500;
margin-right: 12px;
}
.c-func-btn-group--disabled, .c-func-btn-group .disabled {
-webkit-opacity: 0.3;
-khtml-opacity: 0.3;
-moz-opacity: 0.3;
-ms-opacity: 0.3;
-o-opacity: 0.3;
opacity: 0.3;
}
.c-func-btn-group--disabled .c-func-btn, .c-func-btn-group .disabled .c-func-btn {
cursor: not-allowed;
pointer-events: all !important;
}
.c-func-btn-group:last-of-type {
margin-right: 0;
}
.c-func-btn-group--article-control {
margin-bottom: 3px;
}
.c-func-btn.disabled {
-webkit-opacity: 0.3;
-khtml-opacity: 0.3;
-moz-opacity: 0.3;
-ms-opacity: 0.3;
-o-opacity: 0.3;
opacity: 0.3;
cursor: not-allowed;
pointer-events: all !important;
}
/* tab function buttons */
.c-func-tab-group {
float: left;
}
.c-func-tab-group.open {
background: #F3F3F3;
border: 2px solid #AEACAC;
border-color: #AEACAC;
border-bottom-color: #e7e7e7;
}
.c-func-tab-group.other-open {
border-bottom-color: #AEACAC;
z-index: 1;
}
.c-func-tab-group--articles {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.c-func-tab-group--tweets {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-left-color: transparent;
}
.c-func-tab-group.isAlone {
border-left-color: #e7e7e7;
}
.c-func-tab-group.isAlone.open {
border-left-color: #AEACAC;
}
.c-func-tab-group--tweets.isAlone {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
border-left-color: #ccc;
}
.c-func-tab-group--articles.isAlone {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
border-left-color: #ccc;
}
.c-func-tab-group--articles.other-open {
border-right-color: transparent;
}
.c-func-tab-group--tweets.other-open {
border-left-color: transparent;
}
.c-func-tab-btn {
float: left;
color: #666;
}
.c-func-tab-btn--post-articles {
background-image: url(svg/mcd/ico_svg/article-grey-out.svg);
background-repeat: no-repeat;
background-position: 5px 5px;
padding-left: 30px;
padding-top: 12px;
padding-bottom: 8px;
}
.c-func-tab-btn--post-tweets {
background-image: url(svg/mcd/ico_svg/ico-twitter-bird-actual-16-13.svg);
background-size: 20px;
background-repeat: no-repeat;
background-position: 5px 11px;
padding-left: 30px;
padding-top: 12px;
padding-bottom: 8px;
}
.c-func-btn-group--tabs {
margin-right: 12px;
}
.c-func-btn-group--tabs.open {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-color: #AEACAC;
border-bottom-color: #e7e7e7;
}
.c-func-btn-group--tabs.other-open {
border-bottom-color: #AEACAC;
z-index: 1;
}
.c-func-btn-group--tabs:last-of-type {
margin-right: 6px;
}
.c-func-btn-switch .c-func-btn {
border-width: 0 2px 0 0;
border-right-color: #e7e7e7;
margin-right: 0;
border-radius: 0;
}
.c-func-btn-switch .c-func-btn:last-of-type {
border-right: none;
}
.c-func-btn-switch .c-func-btn:first-of-type {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.c-func-btn-switch .c-func-btn:last-of-type {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
@media (max-width: 46.24em) {
.c-func-btn-switch .c-func-btn {
display: block;
width: 100%;
border-right: none;
border-bottom: 1px solid #e7e7e7;
}
.c-func-btn-switch .c-func-btn:last-of-type {
border-bottom: none;
}
}
.c-func-btn-switch.c-func-btn-switch--lrg .c-func-btn {
font-size: 17px;
font-size: 1.7rem;
font-weight: 500;
}
.c-func-btn-switch .c-func-btn.c-func-btn--selected {
background: #FF3366;
border-color: #FF3366;
color: #FFF;
font-weight: 700;
box-shadow: 0 0 0 0.2rem #FF3366;
}
.c-func-btn-switch .c-func-btn.c-func-btn--selected.c-func-btn--magenta {
background: #ff5892;
border-color: #ff5892;
box-shadow: 0 0 0 0.2rem #ff5892;
}
.c-func-btn-switch .c-func-btn.c-func-btn--selected.c-func-btn--blue {
background: #54a3d8;
border-color: #54a3d8;
box-shadow: 0 0 0 0.2rem #54a3d8;
}
.c-func-btn-switch .c-func-btn.c-func-btn--selected.c-func-btn--orange {
background: #ff9f6f;
border-color: #ff9f6f;
box-shadow: 0 0 0 0.2rem #ff9f6f;
}
.c-func-btn-group .c-func-btn {
border-radius: 0;
border-width: 0 2px 0 0;
border-right-color: #e7e7e7;
margin-right: 0;
}
.c-func-btn-group .c-func-btn:last-of-type {
border-right: none;
margin-right: 0;
}
.c-func-btn-group .c-func-btn.c-func-btn--no-br {
border-right: none;
}
.c-func-btn-switch {
border: 2px solid #ccc;
border-radius: 3px;
}
@media (min-width: 46.25em) {
.c-func-btn-switch {
float: left;
}
}
.c-radio-switch {
font-size: 18px;
font-size: 1.8rem;
overflow: hidden;
font-weight: 700;
}
.switch-title {
margin-bottom: 6px;
}
.c-radio-switch input {
position: absolute !important;
clip: rect(0, 0, 0, 0);
height: 1px;
width: 1px;
border: 0;
overflow: hidden;
}
.c-radio-switch label {
display: inline-block;
width: auto;
background-color: #f7f7f7;
color: rgba(0, 0, 0, 0.6);
font-weight: 700;
text-align: center;
text-shadow: none;
padding: 6px 14px;
border: 2px solid rgba(0, 0, 0, 0.2);
border-right-width: 1px;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
}
.c-radio-switch label:last-of-type {
border-right-width: 2px;
}
.c-radio-switch label:hover {
cursor: pointer;
}
.c-radio-switch input:checked + label {
background-color: #A5DC86;
background-color: #ff9f6f;
-webkit-box-shadow: none;
box-shadow: none;
color: #fff;
font-weight: 700;
box-shadow: 0 0 0 0.2rem #FF3366;
}
.c-radio-switch label:first-of-type {
border-radius: 3px 0 0 3px;
}
.c-radio-switch label:last-of-type {
border-radius: 0 3px 3px 0;
}
.c-radio-switch-2 {
display: inline-block;
border: 2px solid #ccc;
border-radius: 3px;
}
.c-radio-switch-2 label.c-radio-switch__btn {
float: left;
border: 2px solid #ccc;
border-radius: 3px;
font-size: 17px;
font-size: 1.7rem;
font-weight: 700;
padding: 10px;
margin-right: 12px;
margin-bottom: 0;
color: #666;
display: inline-block;
width: auto;
border-width: 0 2px 0 0;
border-right-color: #e7e7e7;
margin-right: 0;
border-radius: 0;
}
.c-radio-switch-2 label.c-radio-switch__btn:last-of-type {
border-right: none;
}
.c-radio-switch-2 label.c-radio-switch__btn:first-of-type {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.c-radio-switch-2 label.c-radio-switch__btn:last-of-type {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
@media (max-width: 46.24em) {
.c-radio-switch-2 label.c-radio-switch__btn {
display: block;
width: 100%;
border-right: none;
border-bottom: 1px solid #e7e7e7;
}
.c-radio-switch-2 label.c-radio-switch__btn:last-of-type {
border-bottom: none;
}
}
.c-radio-switch-2 input {
position: absolute !important;
clip: rect(0, 0, 0, 0);
height: 1px;
width: 1px;
border: 0;
overflow: hidden;
}
.c-radio-switch-2 label.c-radio-switch__btn:hover {
cursor: pointer;
}
.c-radio-switch-2 input:checked + label.c-radio-switch__btn {
background: #FF3366;
border-color: #FF3366;
color: #FFF;
font-weight: 700;
border-right-width: 0;
box-shadow: 0 0 0 0.2rem #FF3366;
}
.c-radio-switch-2 input:checked + label.c-radio-switch__btn.c-radio-switch__btn--orange {
background: #ffb089;
border-color: #ffb089;
box-shadow: 0 0 0 0.2rem #ffb089;
}
/* SELECT DROP */
.c-select-drop {
width: auto;
float: right;
}
.c-select-drop__toggle {
cursor: pointer;
}
.c-select-drop__wrapper {
float: left;
position: relative;
overflow: hidden;
border-radius: 3px;
width: auto;
max-width: 500px;
}
.c-select-drop__label {
float: left;
width: auto;
}
.c-select-drop__input {
border: 2px solid #ccc;
border-radius: 3px;
}
/* tools layout */
.c-search-nav__mode {
display: block;
}
@media (min-width: 46.25em) {
.c-search-nav__mode {
float: left;
width: 65%;
margin-right: 24px;
}
}
.c-search-nav__sort {
display: block;
}
@media (min-width: 46.25em) {
.c-search-nav__sort {
float: left;
width: webkit-calc( 35% - 24px);
width: -moz-calc( 35% - 24px);
width: calc( 35% - 24px);
}
}
/* ---------------------------------------------------------------------
#PAGINATION | .pagination = core class | -- modifiers
--------------------------------------------------------------------- */
.pagination {
white-space: nowrap;
color: #cccccc;
}
.pagination__item {
border-width: 1px 0 1px 1px;
border-style: dotted;
border-color: #cccccc;
margin-bottom: 0;
}
.pagination__item:last-of-type {
border-right-width: 1px;
}
.pagination__item:hover {
color: black;
}
.pagination__item--current {
color: #666;
border-width: 2px;
border-style: solid;
border-color: #666;
margin-top: -1px;
margin-right: -1px;
}
.pagination__item--current + .pagination__item {
margin-left: 2px;
border-left: none;
}
.pagination__item--range {
display: none;
border: none;
padding-top: 7px;
padding-right: 7px;
padding-bottom: 7px;
color: #666;
font-size: 14px;
font-size: 1.4rem;
}
@media (min-width: 550px) {
.pagination__item--range {
display: block;
}
}
.pagination__link {
padding: 6px 15px;
color: gray;
background: #FFF;
}
.pagination__link:hover {
color: black;
}
.active .pagination__link {
color: #666;
}
/* ===== PAGINATION =============================================
Author: Ed Patrick | May 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for simple pagination of listed items
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
¦ 1 ¦ 2 ¦ 3 ¦ 4 ¦ Next ¦
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
/* ======================================================================
component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.c-pagination {
*zoom: 1;
margin-bottom: 12px;
color: #4d4d4d;
}
.c-pagination:before, .c-pagination:after {
content: " ";
display: table;
}
.c-pagination:after {
clear: both;
}
.sticky .c-pagination {
margin-bottom: 0;
}
.c-pagination__item {
display: inline-block;
margin-right: 6px;
}
.c-pagination__item--range {
float: left;
padding-top: 8px;
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.6;
}
.c-pagination__control {
display: inline-block;
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
color: #333;
padding: 0 6px 0 6px;
border-bottom: 2px solid #cccccc;
}
.c-pagination__control.s-active {
border-bottom: 2px solid #ff5892;
color: #ff5892;
}
.c-pagination__control--text {
font-family: "Mada", Arial, sans-serif;
font-size: 17px;
font-size: 1.7rem;
color: #54a3d8;
}
.c-pagination__control--text:hover {
color: #ff5892;
transition: 0s;
}
.c-pagination__control:hover {
color: #ff5892;
transition: 0s;
text-decoration: none;
border-bottom: 2px solid #666;
}
.c-pagination__control.disabled {
border-bottom: none;
padding-left: 2px;
padding-right: 2px;
}
.c-pagination__control--chevron {
border-bottom: none;
background-repeat: no-repeat;
background-position: center center;
}
.c-pagination__control--chevron:hover {
border-bottom: none;
}
.c-pagination__control--next {
width: 38px;
height: 38px;
background-image: url(svg/mcd/ico_svg/ico-chevron-right.svg);
}
.c-pagination__control--prev {
width: 38px;
height: 38px;
background-image: url(svg/mcd/ico_svg/ico-chevron-left.svg);
}
.c-pagination__control--start {
width: 14px;
height: 12px;
background-image: url(svg/mcd/ico_svg/ico-2-chevron-left.svg);
}
.c-pagination__control--end {
width: 14px;
height: 12px;
background-image: url(svg/mcd/ico_svg/ico-2-chevron-right.svg);
}
/* ===== VIEW MORE =====================================================
Author: Simon Allin | 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-view more links anywhere on site
*/
.c-view-more {
display: inline-block;
cursor: pointer;
}
.c-view-more--inline {
margin-bottom: -8px;
}
.c-view-more--hide {
display: none;
}
.c-view-more__icon {
float: left;
margin-top: -1px;
margin-right: 3px;
}
.c-view-more__text {
font-size: 14px;
font-size: 1.4rem;
float: left;
line-height: 24px;
color: #666;
}
.c-view-more__text--blue {
color: #54a3d8;
}
/* ===== Angucomplete JS COMPONENT ================================================
Author: Ed Patrick | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
- Use for styling angucomplete auto complete directive
- https://github.com/ghiden/angucomplete-alt
*/
@media (min-width: 46.25em) {
.js-c-angucomplete__label {
display: inline-block;
max-width: 300px;
padding-right: 6px;
}
}
@media (min-width: 46.25em) {
.js-c-angucomplete__container {
display: inline-block;
width: 50%;
}
}
.js-c-angucomplete__container--full-w {
width: 100%;
}
.js-c-angucomplete__container--w-400 {
width: 100%;
max-width: 400px;
}
@media (min-width: 46.25em) {
.js-c-angucomplete__container--w-400 {
max-width: 400px;
}
}
.js-c-angucomplete .angucomplete-dropdown {
margin-top: 6px;
width: 100%;
max-height: 400px;
overflow-y: auto;
}
.js-c-angucomplete .angucomplete-row {
margin-bottom: 6px;
padding-bottom: 6px;
border-bottom: 1px solid;
border-color: #e7e7e7;
}
.js-c-angucomplete .angucomplete-row:last-of-type {
border-bottom: 0;
}
.js-c-angucomplete .angucomplete-row:after {
clear: both;
}
.js-c-angucomplete .angucomplete-input--custom {
width: 100%;
}
.js-c-angucomplete .angucomplete-input--add-contact {
width: 125px;
border: 2px solid #ccc;
border-radius: 3px !important;
padding: 11px 8px 11px 8px;
padding-left: 33px;
font-size: 15px;
font-size: 1.5rem;
background-image: url(svg/mcd/ico-add-contact.svg);
background-repeat: no-repeat;
background-position: 6px 6px;
background-size: 20px;
font-weight: 500;
}
.js-c-angucomplete .angucomplete-input--add-contact:focus {
width: 230px;
border-color: gray;
}
.js-c-angucomplete .angucomplete-row {
*zoom: 1;
}
.js-c-angucomplete .angucomplete-row:before, .js-c-angucomplete .angucomplete-row:after {
content: " ";
display: table;
}
.js-c-angucomplete .angucomplete-row:after {
clear: both;
}
.js-c-angucomplete .angucomplete-selected-row {
color: #333;
background-color: #EEEEEE;
}
.js-c-angucomplete .angucomplete-image {
border: none;
border-radius: 0;
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
}
.js-c-angucomplete .angucomplete-image-holder {
height: 65px;
width: 65px;
border: none;
}
.js-c-angucomplete .angucomplete-description {
color: #ff5892;
}
.js-c-angucomplete .angucomplete-searching {
font-size: 18px;
font-size: 1.8rem;
}
.js-c-angucomplete--fixed-w-dropdown .angucomplete-dropdown {
width: 500px;
}
.js-c-angucomplete-item {
position: relative;
}
.js-c-angucomplete-item__thumbnail {
float: left;
width: 60px;
position: relative;
margin-right: 12px;
}
.js-c-angucomplete-item__thumbnail figure {
margin: 0;
}
.js-c-angucomplete-item__about {
float: left;
width: webkit-calc((100% - ( 12px + 60px )));
width: -moz-calc((100% - ( 12px + 60px )));
width: calc((100% - ( 12px + 60px )));
padding-right: 12px;
}
.js-c-angucomplete-item__title {
margin: 0;
font-family: "Mada", Arial, sans-serif;
font-size: 24px;
font-size: 2.4rem;
letter-spacing: -1px;
font-weight: 300;
color: #292f33;
font-size: 26px;
font-size: 2.6rem;
}
.js-c-angucomplete-item__desc {
font-size: 15px;
font-size: 1.5rem;
color: #333;
}
.js-c-angucomplete-item__remove {
cursor: pointer;
position: absolute;
top: 0;
right: 0;
}
/* ===== NAVIGATION COMPONENT ===============================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-component for universal cross site service navigaiton
+-------------------------------+
| ~ | ~ | ~ | ~ | | ~ |
+-------------------------------+
*/
/*
* SETUP
* - Mixins
* - Variables
* - Settings
*/
/* ======================================================================
local settigns / mixins etc ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* ======================================================================
dropdown component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
/* standard dropdown class */
.js-dropdown {
/* base */
left: 0;
width: 100%;
padding: 24px;
background: #fff;
z-index: 100;
cursor: auto;
/* mobile border */
border-width: 0 0 2px 0;
border-color: #9A9A9A;
border-style: solid;
/* position */
position: absolute;
top: 55px;
/* hide initial */
display: none;
opacity: 0;
/* show with class applied */
}
.js-dropdown.s-show {
display: block;
opacity: 1;
}
.js-dropdown--no-border {
border-width: 0 0 0 0 !important;
-webkit-box-shadow: 0px 0px 28px -2px rgba(0, 0, 0, 0.39);
-moz-box-shadow: 0px 0px 28px -2px rgba(0, 0, 0, 0.39);
box-shadow: 0px 0px 28px -2px rgba(0, 0, 0, 0.39);
}
/* let the parent define styling depending on breakpoint */
@media (min-width: 34.375em) {
.js-dropdown-parent-w-setting\@mobile {
/* parent gets relative */
position: relative;
/* generic border gets added to dropdown */
/* left aligned dropdowns */
/* first left aligned dropdown gets special treatment */
/* right aligned dropdowns */
/* last right aligned dropdown gets specia treatment */
/* width control - custom widths get applied at desired width */
/* custom max width control */
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown {
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--rs {
border-top-width: 2px !important;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--l {
left: -2px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--l-first {
left: 0;
border-width: 0 2px 2px 0;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--r {
right: -2px;
left: auto;
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--r-last {
right: 0;
left: auto;
border-width: 0 0 2px 2px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--w-1 {
width: 350px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--w-2 {
width: 450px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--w-3 {
width: 550px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--w-4 {
width: 650px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--w-5 {
width: 710px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--max-w-1 {
max-width: 350px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--max-w-2 {
max-width: 450px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--max-w-3 {
max-width: 550px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--max-w-4 {
max-width: 650px;
}
.js-dropdown-parent-w-setting\@mobile .js-dropdown--max-w-5 {
max-width: 710px;
}
}
@media (min-width: 46.25em) {
.js-dropdown-parent-w-setting\@tablet {
/* parent gets relative */
position: relative;
/* generic border gets added to dropdown */
/* left aligned dropdowns */
/* first left aligned dropdown gets special treatment */
/* right aligned dropdowns */
/* last right aligned dropdown gets specia treatment */
/* width control - custom widths get applied at desired width */
/* custom max width control */
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown {
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--rs {
border-top-width: 2px !important;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--l {
left: -2px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--l-first {
left: 0;
border-width: 0 2px 2px 0;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--r {
right: -2px;
left: auto;
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--r-last {
right: 0;
left: auto;
border-width: 0 0 2px 2px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--w-1 {
width: 350px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--w-2 {
width: 450px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--w-3 {
width: 550px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--w-4 {
width: 650px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--w-5 {
width: 710px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--max-w-1 {
max-width: 350px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--max-w-2 {
max-width: 450px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--max-w-3 {
max-width: 550px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--max-w-4 {
max-width: 650px;
}
.js-dropdown-parent-w-setting\@tablet .js-dropdown--max-w-5 {
max-width: 710px;
}
}
@media (min-width: 52.5em) {
.js-dropdown-parent-w-setting\@medium {
/* parent gets relative */
position: relative;
/* generic border gets added to dropdown */
/* left aligned dropdowns */
/* first left aligned dropdown gets special treatment */
/* right aligned dropdowns */
/* last right aligned dropdown gets specia treatment */
/* width control - custom widths get applied at desired width */
/* custom max width control */
}
.js-dropdown-parent-w-setting\@medium .js-dropdown {
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--rs {
border-top-width: 2px !important;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--l {
left: -2px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--l-first {
left: 0;
border-width: 0 2px 2px 0;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--r {
right: -2px;
left: auto;
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--r-last {
right: 0;
left: auto;
border-width: 0 0 2px 2px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--w-1 {
width: 350px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--w-2 {
width: 450px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--w-3 {
width: 550px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--w-4 {
width: 650px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--w-5 {
width: 710px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--max-w-1 {
max-width: 350px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--max-w-2 {
max-width: 450px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--max-w-3 {
max-width: 550px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--max-w-4 {
max-width: 650px;
}
.js-dropdown-parent-w-setting\@medium .js-dropdown--max-w-5 {
max-width: 710px;
}
}
@media (min-width: 61.25em) {
.js-dropdown-parent-w-setting\@desktop {
/* parent gets relative */
position: relative;
/* generic border gets added to dropdown */
/* left aligned dropdowns */
/* first left aligned dropdown gets special treatment */
/* right aligned dropdowns */
/* last right aligned dropdown gets specia treatment */
/* width control - custom widths get applied at desired width */
/* custom max width control */
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown {
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--rs {
border-top-width: 2px !important;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--l {
left: -2px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--l-first {
left: 0;
border-width: 0 2px 2px 0;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--r {
right: -2px;
left: auto;
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--r-last {
right: 0;
left: auto;
border-width: 0 0 2px 2px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--w-1 {
width: 350px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--w-2 {
width: 450px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--w-3 {
width: 550px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--w-4 {
width: 650px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--w-5 {
width: 710px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--max-w-1 {
max-width: 350px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--max-w-2 {
max-width: 450px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--max-w-3 {
max-width: 550px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--max-w-4 {
max-width: 650px;
}
.js-dropdown-parent-w-setting\@desktop .js-dropdown--max-w-5 {
max-width: 710px;
}
}
@media (min-width: 64em) {
.js-dropdown-parent-w-setting\@desktop-medium {
/* parent gets relative */
position: relative;
/* generic border gets added to dropdown */
/* left aligned dropdowns */
/* first left aligned dropdown gets special treatment */
/* right aligned dropdowns */
/* last right aligned dropdown gets specia treatment */
/* width control - custom widths get applied at desired width */
/* custom max width control */
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown {
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--rs {
border-top-width: 2px !important;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--l {
left: -2px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--l-first {
left: 0;
border-width: 0 2px 2px 0;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--r {
right: -2px;
left: auto;
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--r-last {
right: 0;
left: auto;
border-width: 0 0 2px 2px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--w-1 {
width: 350px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--w-2 {
width: 450px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--w-3 {
width: 550px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--w-4 {
width: 650px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--w-5 {
width: 710px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--max-w-1 {
max-width: 350px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--max-w-2 {
max-width: 450px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--max-w-3 {
max-width: 550px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--max-w-4 {
max-width: 650px;
}
.js-dropdown-parent-w-setting\@desktop-medium .js-dropdown--max-w-5 {
max-width: 710px;
}
}
@media (min-width: 71.875em) {
.js-dropdown-parent-w-setting\@desktop-wide {
/* parent gets relative */
position: relative;
/* generic border gets added to dropdown */
/* left aligned dropdowns */
/* first left aligned dropdown gets special treatment */
/* right aligned dropdowns */
/* last right aligned dropdown gets specia treatment */
/* width control - custom widths get applied at desired width */
/* custom max width control */
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown {
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--rs {
border-top-width: 2px !important;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--l {
left: -2px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--l-first {
left: 0;
border-width: 0 2px 2px 0;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--r {
right: -2px;
left: auto;
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--r-last {
right: 0;
left: auto;
border-width: 0 0 2px 2px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--w-1 {
width: 350px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--w-2 {
width: 450px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--w-3 {
width: 550px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--w-4 {
width: 650px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--w-5 {
width: 710px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--max-w-1 {
max-width: 350px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--max-w-2 {
max-width: 450px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--max-w-3 {
max-width: 550px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--max-w-4 {
max-width: 650px;
}
.js-dropdown-parent-w-setting\@desktop-wide .js-dropdown--max-w-5 {
max-width: 710px;
}
}
@media (min-width: 81.25em) {
.js-dropdown-parent-w-setting\@wide {
/* parent gets relative */
position: relative;
/* generic border gets added to dropdown */
/* left aligned dropdowns */
/* first left aligned dropdown gets special treatment */
/* right aligned dropdowns */
/* last right aligned dropdown gets specia treatment */
/* width control - custom widths get applied at desired width */
/* custom max width control */
}
.js-dropdown-parent-w-setting\@wide .js-dropdown {
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--rs {
border-top-width: 2px !important;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--l {
left: -2px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--l-first {
left: 0;
border-width: 0 2px 2px 0;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--r {
right: -2px;
left: auto;
border-width: 0 2px 2px 2px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--r-last {
right: 0;
left: auto;
border-width: 0 0 2px 2px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--w-1 {
width: 350px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--w-2 {
width: 450px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--w-3 {
width: 550px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--w-4 {
width: 650px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--w-5 {
width: 710px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--max-w-1 {
max-width: 350px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--max-w-2 {
max-width: 450px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--max-w-3 {
max-width: 550px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--max-w-4 {
max-width: 650px;
}
.js-dropdown-parent-w-setting\@wide .js-dropdown--max-w-5 {
max-width: 710px;
}
}
/* ======================================================================
slidedown component ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.js-slidedown {
/* base */
width: 100%;
height: auto;
background: #fff;
position: relative;
padding: 24px;
/* hide initial */
display: none;
opacity: 0;
/* show with class applied */
/* light grey option background */
/* reduced bottom padding */
}
.js-slidedown.s-show {
display: block;
opacity: 1;
}
.js-slidedown--bkgrnd-grey {
background-color: #f7f7f7;
}
.js-slidedown--bdr-bottom {
border-bottom: 2px solid #D8D8D8;
}
.js-slidedown--cats {
padding-bottom: 16px;
}
.open > .js-uib-dropdown {
padding: 24px;
width: 100%;
border-width: 0 0 3px 0;
border-style: solid;
border-color: #a3a3a3;
cursor: auto;
}
@media (min-width: 81.25em) {
.open > .js-uib-dropdown--w-85 {
width: 85%;
border-width: 0 3px 3px 0;
}
}
@media (min-width: 61.25em) {
.open > .js-uib-dropdown--w-50 {
width: 50%;
border-width: 0 3px 3px 0;
}
}
.open > .js-uib-dropdown--l {
left: -2px;
}
/* ===== MOBILE NAVIGATION COMPONENT ========================================
Author: Simon Allin | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
-component for universal cross site service navigaiton
*/
/*
* SETUP
* - Mixins
* - Variables
* - Settings
*/
/* dropdown width config */
/*
* COMPONENT
*/
body.noscroll {
width: 100%;
position: fixed;
overflow-y: hidden;
}
/* mobile nav trigger with variation for main and sub nav */
.js-mobile-menu-trigger, .js-mobile-sub-menu-trigger {
width: 55px;
height: 55px;
background-color: #ff9f6f;
background-image: url(svg/ico/ico-hamburger.svg);
background-repeat: no-repeat;
background-position: 19px 19px;
background-size: 20px;
float: right;
display: inline;
}
.js-mobile-menu-trigger:hover, .js-mobile-sub-menu-trigger:hover {
background-color: #ff8e56;
}
.js-mobile-menu-trigger.s-active, .js-mobile-sub-menu-trigger.s-active {
background-color: #ff9f6f;
border-bottom-color: #1067b0;
}
/* second level mobile trigger */
.js-mobile-sub-menu-trigger {
cursor: pointer;
background-color: #fff;
height: 53px;
background-image: url(svg/ico/ico-menu-arrow.svg);
/* active state */
/* full height option */
}
.js-mobile-sub-menu-trigger:hover {
background-color: #e5e5e5;
}
.js-mobile-sub-menu-trigger.s-active {
background-image: url(svg/ico/ico-menu-arrow-active.svg);
background-color: #e5e5e5;
}
.js-mobile-sub-menu-trigger--rs-brand {
background-color: #1067b0;
}
.js-mobile-sub-menu-trigger--rs-brand:hover, .js-mobile-sub-menu-trigger--rs-brand.s-active {
background-color: #1067b0;
}
.js-mobile-sub-menu-trigger--vuelio-brand {
background-color: #264592;
}
.js-mobile-sub-menu-trigger--vuelio-brand:hover, .js-mobile-sub-menu-trigger--vuelio-brand.s-active {
background-color: #264592;
}
.js-mobile-sub-menu-trigger--rs-brand, .js-mobile-sub-menu-trigger--vuelio-brand {
background-image: url(svg/ico/ico-menu-arrow-down--white.svg);
}
.js-mobile-sub-menu-trigger--rs-brand.s-active, .js-mobile-sub-menu-trigger--vuelio-brand.s-active {
background-image: url(svg/ico/ico-menu-arrow-up--white.svg);
}
.js-mobile-sub-menu-trigger--f-height {
height: 55px;
}
/* mobile menu with variation for main and sub nav */
.js-mobile-menu, .js-mobile-sub-menu {
width: 100%;
height: 100%;
position: fixed;
top: 55px;
right: -100%;
background-color: white;
z-index: 10;
font-family: "Mada", Arial, sans-serif;
-webkit-transition: all 0.1s linear;
-khtml-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-ms-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
transition: all 0.1s linear;
}
@media (min-width: 46.25em) {
.js-mobile-menu--nrml-optn, .js-mobile-sub-menu--nrml-optn {
display: none;
opacity: 0;
}
}
@media (min-width: 61.25em) {
.js-mobile-menu--w-optn, .js-mobile-sub-menu--w-optn {
display: none;
opacity: 0;
}
}
.js-mobile-menu.s-show, .js-mobile-sub-menu.s-show {
right: 0px;
overflow-y: auto;
z-index: 100;
border-top: 3px solid #1067b0;
}
/* sub menu distance double nav height */
.js-mobile-sub-menu {
top: 110px;
}
/* ==========================================================================
Category selector styles
========================================================================== */
.accordion-container {
width: 320px;
border: 2px solid #e7e7e7;
padding: 6px;
float: left;
height: 600px;
overflow-y: scroll;
}
#catergory_input .ui-accordion-header {
padding: 12px;
padding-left: 2px;
font-size: 16px;
font-size: 1.6rem;
}
#catergory_input .menu_categories {
font-family: Arial, sans-serif;
font-weight: 400;
font-size: 14px;
width: 100%;
}
#catergory_input .menu_categories_selected {
width: webkit-calc((100% - ( 320px + 12px )));
width: -moz-calc((100% - ( 320px + 12px )));
width: calc((100% - ( 320px + 12px )));
margin-left: 12px;
overflow-y: auto;
float: right;
}
#catergory_input #accordion_filter {
font-size: 20px;
font-size: 2rem;
}
#catergory_input #accordion_filter input {
padding: 8px 12px;
margin: 0;
font-size: 1em;
}
#catergory_input .ui-accordion-header.ui-state-default {
background-color: #FFFFFF;
border: 0;
border-bottom: 1px solid #e7e7e7;
}
#catergory_input .ui-accordion-header.ui-state-default:last-of-type {
border-bottom: 0;
}
#catergory_input .ui-accordion-header.ui-state-hover {
background-color: #e7e7e7;
border: 0;
}
#catergory_input .ui-accordion-header.ui-state-focus {
background-color: #e7e7e7;
border: 0;
}
#catergory_input .ui-accordion-header.ui-state-active {
background-color: #e7e7e7;
border: 0;
}
#catergory_input .remove_item {
color: red;
text-decoration: none;
}
#catergory_input #accordion .ui-accordion-content {
border: none;
background: #FFFFFF;
padding-left: 10px;
padding-right: 5px;
margin-top: -3px;
}
#catergory_input #accordion .ui-accordion-content.ui-accordion-content-active {
border-left: 1px #e7e7e7 solid;
border-right: 1px #e7e7e7 solid;
border-bottom: 1px #e7e7e7 solid;
}
#catergory_input h3 {
background-image: none;
border-radius: 0;
padding-left: 5px;
font-size: 16px;
margin: 0 0 2px;
font-weight: normal;
color: #555555;
}
#catergory_input .menu_categories_selected li {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
margin-right: 8px;
margin-bottom: 8px;
padding: 4px 8px;
float: left;
display: inline;
border: 1px solid #cccccc;
line-height: 1.6;
color: #333;
}
#catergory_input .menu_categories {
position: relative;
}
#catergory_input .menu_categories .ui-accordion-header.ui-accordion-header-active {
border: none;
}
#catergory_input .menu_categories .ui-accordion-content {
padding: 0.6em 1.5em;
border-radius: 0 0 0 0;
}
#catergory_input .menu_categories .ui-accordion-content input[type=checkbox] {
float: left;
margin: 1px 5px 0 0;
width: auto;
}
#catergory_input .menu_categories .ui-accordion-content label {
float: left;
width: 90%;
height: auto;
padding: 0;
font-size: 13px !important;
}
.ui-accordion-header:focus {
outline: none;
}
.ui-accordion .ui-accordion-header input[type=checkbox] {
float: none;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
right: 6px;
left: inherit;
}
.ui-accordion .ui-accordion-header .ui-icon {
float: right;
left: inherit;
}
#accordion_filter {
width: 100%;
margin: 3px 0 15px;
}
#catergory_input #accordion .check-group {
margin: 2px 6px 0 4px;
width: auto; /*position: absolute; top: 10px; right: 10px;*/
}
#catergory_input #accordion li {
padding: 6px 0;
margin: 0 0 6px 0;
clear: both;
}
#catergory_input .ui-accordion .ui-accordion-header .ui-icon {
left: inherit;
}
/* Duplicated on main.css for fe */
#catergory_input .llink {
color: #006699;
cursor: pointer;
}
#catergory_input .llink.right {
float: right;
font-size: 80%;
margin-right: 15px;
}
.optional_refinement .country_utilities {
margin-bottom: 0;
}
.optional_refinement #accordion_filter input {
font-size: 0.85em;
}
.menu_categories_selected ul {
list-style-type: none;
padding-left: 0;
}
.menu_categories_selected li.placeholder {
padding: 0;
border: 0;
font-style: italic;
background: transparent;
}
.menu_categories_selected .cat_error {
display: none;
}
.menu_categories_selected .cat_error.active {
color: #FF0033;
text-decoration: underline;
font-style: italic;
background: transparent;
padding: 0;
margin-bottom: 8px;
}
.menu_categories_selected.cat_error.active {
border: 1px solid #FF0033;
padding: 8px;
}
/* ===== Angucomplete JS COMPONENT ================================================
Author: Ed Patrick | 2018 |
========================================================================== */
/* DOCUMENT INFORMATION
- Used for overwriting custom styles for dropzone image uploader
- https://www.dropzonejs.com
*/
.js-c-dropzone .dropzone .dz-preview:hover .dz-image img {
-webkit-filter: blur(0px);
filter: blur(0px);
}
.js-c-dropzone .dropzone .dz-preview .dz-progress .dz-upload {
background: #5E9931;
}
.js-c-dropzone .dropzone .js-c-dropzone-single__remove {
cursor: pointer;
}
.js-c-dropzone .dropzone .dz-filename {
color: #333;
display: block;
margin-top: 0;
margin-bottom: 12px;
font-family: "Mada", Arial, sans-serif;
font-size: 19px;
font-size: 1.9rem;
letter-spacing: -0.4px;
font-weight: 700;
}
.js-c-dropzone .dropzone .dz-preview .dz-remove {
color: #ff7979;
font-size: 14px;
font-size: 1.4rem;
}
.js-c-dropzone--gallery .dropzone {
border-style: dotted;
border-width: 3px;
}
.js-c-dropzone--gallery .dropzone.dz-started .dz-message {
display: block;
}
.js-c-dropzone--gallery .dropzone .dz-preview {
width: 100%;
}
@media (min-width: 34.375em) {
.js-c-dropzone--gallery .dropzone .dz-preview {
width: webkit-calc(((50% - 24px ) ));
width: -moz-calc(((50% - 24px ) ));
width: calc(((50% - 24px ) ));
margin: 12px;
}
}
@media (min-width: 46.25em) {
.js-c-dropzone--gallery .dropzone .dz-preview {
width: webkit-calc(((25% - 48px ) ));
width: -moz-calc(((25% - 48px ) ));
width: calc(((25% - 48px ) ));
margin: 24px;
}
}
.js-c-dropzone--gallery .dropzone .dz-preview .dz-image {
width: 100%;
max-width: 300px;
border-radius: 0px;
margin-bottom: 12px;
height: auto;
}
.js-c-dropzone--gallery .dropzone .dz-preview .dz-image img {
margin: 0 auto;
}
/**
* Dropzone styling for single image uploader
*/
.js-c-dropzone--single .dropzone {
border-color: transparent;
border-width: 0px;
margin: 0;
padding: 0;
}
.js-c-dropzone--single .dropzone .dz-message {
text-align: left;
margin: 0;
padding: 0;
}
.js-c-dropzone--single .dropzone .dz-preview.dz-image-preview {
margin-left: 0;
}
.js-c-dropzone--single .dropzone .dz-preview .dz-image {
width: 100%;
height: auto;
border-radius: 0px;
}
/* ==========================================================================
#CLEARFIX
========================================================================== */
/**
* Attach our clearfix mixin to a utility class.
*/
.u-clearfix:after {
content: "" !important;
display: block !important;
clear: both !important;
}
/* ==========================================================================
#WIDTHS
========================================================================== */
/**
* inuitcss generates a series of utility classes that give a fluid width to
* whichever element they’re applied, e.g.:
*
* ![]()
*
* These classes are most commonly used in conjunction with our layout system,
* e.g.:
*
*
*
* By default, inuitcss will also generate responsive variants of each of these
* classes by using your Sass MQ configuration, e.g.:
*
*
*
* Optionally, inuitcss can generate offset classes which can push and pull
* elements left and right by a specified amount, e.g.:
*
*
*
* This is useful for making very granular changes to the rendered order of
* items in a layout.
*
* N.B. This option is turned off by default.
*/
/**
* A series of width helper classes that you can use to size things like grid
* systems. Classes take a fraction-like format (e.g. `.u-2/3`). Use these in
* your markup:
*
*
*
* The following will generate widths helper classes based on the fractions
* defined in the `$inuit-fractions` list.
*/
.u-1\/1 {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/1 {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-1\/1 {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/2 {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/2 {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-1\/2 {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-2\/2 {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/2 {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-2\/2 {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/3 {
width: 33.3333333333% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/3 {
position: relative !important;
right: auto !important; /* [1] */
left: 33.3333333333% !important;
}
.u-pull-1\/3 {
position: relative !important;
right: 33.3333333333% !important;
left: auto !important; /* [1] */
}
.u-2\/3 {
width: 66.6666666667% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/3 {
position: relative !important;
right: auto !important; /* [1] */
left: 66.6666666667% !important;
}
.u-pull-2\/3 {
position: relative !important;
right: 66.6666666667% !important;
left: auto !important; /* [1] */
}
.u-3\/3 {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/3 {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-3\/3 {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/4 {
width: 25% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/4 {
position: relative !important;
right: auto !important; /* [1] */
left: 25% !important;
}
.u-pull-1\/4 {
position: relative !important;
right: 25% !important;
left: auto !important; /* [1] */
}
.u-2\/4 {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/4 {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-2\/4 {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-3\/4 {
width: 75% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/4 {
position: relative !important;
right: auto !important; /* [1] */
left: 75% !important;
}
.u-pull-3\/4 {
position: relative !important;
right: 75% !important;
left: auto !important; /* [1] */
}
.u-4\/4 {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/4 {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-4\/4 {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/5 {
width: 20% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/5 {
position: relative !important;
right: auto !important; /* [1] */
left: 20% !important;
}
.u-pull-1\/5 {
position: relative !important;
right: 20% !important;
left: auto !important; /* [1] */
}
.u-2\/5 {
width: 40% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/5 {
position: relative !important;
right: auto !important; /* [1] */
left: 40% !important;
}
.u-pull-2\/5 {
position: relative !important;
right: 40% !important;
left: auto !important; /* [1] */
}
.u-3\/5 {
width: 60% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/5 {
position: relative !important;
right: auto !important; /* [1] */
left: 60% !important;
}
.u-pull-3\/5 {
position: relative !important;
right: 60% !important;
left: auto !important; /* [1] */
}
.u-4\/5 {
width: 80% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/5 {
position: relative !important;
right: auto !important; /* [1] */
left: 80% !important;
}
.u-pull-4\/5 {
position: relative !important;
right: 80% !important;
left: auto !important; /* [1] */
}
.u-5\/5 {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-5\/5 {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-5\/5 {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
/**
* If we’re using Sass-MQ, automatically generate grid system(s) for each of our
* defined breakpoints, and give them a Responsive Suffix, e.g.:
*
*
*/
@media (min-width: 34.375em) {
.u-1\/1\@mobile {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/1\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-1\/1\@mobile {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/2\@mobile {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/2\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-1\/2\@mobile {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-2\/2\@mobile {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/2\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-2\/2\@mobile {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/3\@mobile {
width: 33.3333333333% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/3\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 33.3333333333% !important;
}
.u-pull-1\/3\@mobile {
position: relative !important;
right: 33.3333333333% !important;
left: auto !important; /* [1] */
}
.u-2\/3\@mobile {
width: 66.6666666667% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/3\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 66.6666666667% !important;
}
.u-pull-2\/3\@mobile {
position: relative !important;
right: 66.6666666667% !important;
left: auto !important; /* [1] */
}
.u-3\/3\@mobile {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/3\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-3\/3\@mobile {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/4\@mobile {
width: 25% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/4\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 25% !important;
}
.u-pull-1\/4\@mobile {
position: relative !important;
right: 25% !important;
left: auto !important; /* [1] */
}
.u-2\/4\@mobile {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/4\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-2\/4\@mobile {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-3\/4\@mobile {
width: 75% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/4\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 75% !important;
}
.u-pull-3\/4\@mobile {
position: relative !important;
right: 75% !important;
left: auto !important; /* [1] */
}
.u-4\/4\@mobile {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/4\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-4\/4\@mobile {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/5\@mobile {
width: 20% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/5\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 20% !important;
}
.u-pull-1\/5\@mobile {
position: relative !important;
right: 20% !important;
left: auto !important; /* [1] */
}
.u-2\/5\@mobile {
width: 40% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/5\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 40% !important;
}
.u-pull-2\/5\@mobile {
position: relative !important;
right: 40% !important;
left: auto !important; /* [1] */
}
.u-3\/5\@mobile {
width: 60% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/5\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 60% !important;
}
.u-pull-3\/5\@mobile {
position: relative !important;
right: 60% !important;
left: auto !important; /* [1] */
}
.u-4\/5\@mobile {
width: 80% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/5\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 80% !important;
}
.u-pull-4\/5\@mobile {
position: relative !important;
right: 80% !important;
left: auto !important; /* [1] */
}
.u-5\/5\@mobile {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-5\/5\@mobile {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-5\/5\@mobile {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
}
@media (min-width: 46.25em) {
.u-1\/1\@tablet {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/1\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-1\/1\@tablet {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/2\@tablet {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/2\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-1\/2\@tablet {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-2\/2\@tablet {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/2\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-2\/2\@tablet {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/3\@tablet {
width: 33.3333333333% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/3\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 33.3333333333% !important;
}
.u-pull-1\/3\@tablet {
position: relative !important;
right: 33.3333333333% !important;
left: auto !important; /* [1] */
}
.u-2\/3\@tablet {
width: 66.6666666667% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/3\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 66.6666666667% !important;
}
.u-pull-2\/3\@tablet {
position: relative !important;
right: 66.6666666667% !important;
left: auto !important; /* [1] */
}
.u-3\/3\@tablet {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/3\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-3\/3\@tablet {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/4\@tablet {
width: 25% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/4\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 25% !important;
}
.u-pull-1\/4\@tablet {
position: relative !important;
right: 25% !important;
left: auto !important; /* [1] */
}
.u-2\/4\@tablet {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/4\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-2\/4\@tablet {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-3\/4\@tablet {
width: 75% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/4\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 75% !important;
}
.u-pull-3\/4\@tablet {
position: relative !important;
right: 75% !important;
left: auto !important; /* [1] */
}
.u-4\/4\@tablet {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/4\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-4\/4\@tablet {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/5\@tablet {
width: 20% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/5\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 20% !important;
}
.u-pull-1\/5\@tablet {
position: relative !important;
right: 20% !important;
left: auto !important; /* [1] */
}
.u-2\/5\@tablet {
width: 40% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/5\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 40% !important;
}
.u-pull-2\/5\@tablet {
position: relative !important;
right: 40% !important;
left: auto !important; /* [1] */
}
.u-3\/5\@tablet {
width: 60% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/5\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 60% !important;
}
.u-pull-3\/5\@tablet {
position: relative !important;
right: 60% !important;
left: auto !important; /* [1] */
}
.u-4\/5\@tablet {
width: 80% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/5\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 80% !important;
}
.u-pull-4\/5\@tablet {
position: relative !important;
right: 80% !important;
left: auto !important; /* [1] */
}
.u-5\/5\@tablet {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-5\/5\@tablet {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-5\/5\@tablet {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
}
@media (min-width: 52.5em) {
.u-1\/1\@medium {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/1\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-1\/1\@medium {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/2\@medium {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/2\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-1\/2\@medium {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-2\/2\@medium {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/2\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-2\/2\@medium {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/3\@medium {
width: 33.3333333333% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/3\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 33.3333333333% !important;
}
.u-pull-1\/3\@medium {
position: relative !important;
right: 33.3333333333% !important;
left: auto !important; /* [1] */
}
.u-2\/3\@medium {
width: 66.6666666667% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/3\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 66.6666666667% !important;
}
.u-pull-2\/3\@medium {
position: relative !important;
right: 66.6666666667% !important;
left: auto !important; /* [1] */
}
.u-3\/3\@medium {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/3\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-3\/3\@medium {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/4\@medium {
width: 25% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/4\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 25% !important;
}
.u-pull-1\/4\@medium {
position: relative !important;
right: 25% !important;
left: auto !important; /* [1] */
}
.u-2\/4\@medium {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/4\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-2\/4\@medium {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-3\/4\@medium {
width: 75% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/4\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 75% !important;
}
.u-pull-3\/4\@medium {
position: relative !important;
right: 75% !important;
left: auto !important; /* [1] */
}
.u-4\/4\@medium {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/4\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-4\/4\@medium {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/5\@medium {
width: 20% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/5\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 20% !important;
}
.u-pull-1\/5\@medium {
position: relative !important;
right: 20% !important;
left: auto !important; /* [1] */
}
.u-2\/5\@medium {
width: 40% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/5\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 40% !important;
}
.u-pull-2\/5\@medium {
position: relative !important;
right: 40% !important;
left: auto !important; /* [1] */
}
.u-3\/5\@medium {
width: 60% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/5\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 60% !important;
}
.u-pull-3\/5\@medium {
position: relative !important;
right: 60% !important;
left: auto !important; /* [1] */
}
.u-4\/5\@medium {
width: 80% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/5\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 80% !important;
}
.u-pull-4\/5\@medium {
position: relative !important;
right: 80% !important;
left: auto !important; /* [1] */
}
.u-5\/5\@medium {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-5\/5\@medium {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-5\/5\@medium {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
}
@media (min-width: 61.25em) {
.u-1\/1\@desktop {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/1\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-1\/1\@desktop {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/2\@desktop {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/2\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-1\/2\@desktop {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-2\/2\@desktop {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/2\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-2\/2\@desktop {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/3\@desktop {
width: 33.3333333333% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/3\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 33.3333333333% !important;
}
.u-pull-1\/3\@desktop {
position: relative !important;
right: 33.3333333333% !important;
left: auto !important; /* [1] */
}
.u-2\/3\@desktop {
width: 66.6666666667% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/3\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 66.6666666667% !important;
}
.u-pull-2\/3\@desktop {
position: relative !important;
right: 66.6666666667% !important;
left: auto !important; /* [1] */
}
.u-3\/3\@desktop {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/3\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-3\/3\@desktop {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/4\@desktop {
width: 25% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/4\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 25% !important;
}
.u-pull-1\/4\@desktop {
position: relative !important;
right: 25% !important;
left: auto !important; /* [1] */
}
.u-2\/4\@desktop {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/4\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-2\/4\@desktop {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-3\/4\@desktop {
width: 75% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/4\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 75% !important;
}
.u-pull-3\/4\@desktop {
position: relative !important;
right: 75% !important;
left: auto !important; /* [1] */
}
.u-4\/4\@desktop {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/4\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-4\/4\@desktop {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/5\@desktop {
width: 20% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/5\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 20% !important;
}
.u-pull-1\/5\@desktop {
position: relative !important;
right: 20% !important;
left: auto !important; /* [1] */
}
.u-2\/5\@desktop {
width: 40% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/5\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 40% !important;
}
.u-pull-2\/5\@desktop {
position: relative !important;
right: 40% !important;
left: auto !important; /* [1] */
}
.u-3\/5\@desktop {
width: 60% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/5\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 60% !important;
}
.u-pull-3\/5\@desktop {
position: relative !important;
right: 60% !important;
left: auto !important; /* [1] */
}
.u-4\/5\@desktop {
width: 80% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/5\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 80% !important;
}
.u-pull-4\/5\@desktop {
position: relative !important;
right: 80% !important;
left: auto !important; /* [1] */
}
.u-5\/5\@desktop {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-5\/5\@desktop {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-5\/5\@desktop {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
}
@media (min-width: 64em) {
.u-1\/1\@desktop-medium {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/1\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-1\/1\@desktop-medium {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/2\@desktop-medium {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/2\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-1\/2\@desktop-medium {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-2\/2\@desktop-medium {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/2\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-2\/2\@desktop-medium {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/3\@desktop-medium {
width: 33.3333333333% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/3\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 33.3333333333% !important;
}
.u-pull-1\/3\@desktop-medium {
position: relative !important;
right: 33.3333333333% !important;
left: auto !important; /* [1] */
}
.u-2\/3\@desktop-medium {
width: 66.6666666667% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/3\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 66.6666666667% !important;
}
.u-pull-2\/3\@desktop-medium {
position: relative !important;
right: 66.6666666667% !important;
left: auto !important; /* [1] */
}
.u-3\/3\@desktop-medium {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/3\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-3\/3\@desktop-medium {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/4\@desktop-medium {
width: 25% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/4\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 25% !important;
}
.u-pull-1\/4\@desktop-medium {
position: relative !important;
right: 25% !important;
left: auto !important; /* [1] */
}
.u-2\/4\@desktop-medium {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/4\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-2\/4\@desktop-medium {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-3\/4\@desktop-medium {
width: 75% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/4\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 75% !important;
}
.u-pull-3\/4\@desktop-medium {
position: relative !important;
right: 75% !important;
left: auto !important; /* [1] */
}
.u-4\/4\@desktop-medium {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/4\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-4\/4\@desktop-medium {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/5\@desktop-medium {
width: 20% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/5\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 20% !important;
}
.u-pull-1\/5\@desktop-medium {
position: relative !important;
right: 20% !important;
left: auto !important; /* [1] */
}
.u-2\/5\@desktop-medium {
width: 40% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/5\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 40% !important;
}
.u-pull-2\/5\@desktop-medium {
position: relative !important;
right: 40% !important;
left: auto !important; /* [1] */
}
.u-3\/5\@desktop-medium {
width: 60% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/5\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 60% !important;
}
.u-pull-3\/5\@desktop-medium {
position: relative !important;
right: 60% !important;
left: auto !important; /* [1] */
}
.u-4\/5\@desktop-medium {
width: 80% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/5\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 80% !important;
}
.u-pull-4\/5\@desktop-medium {
position: relative !important;
right: 80% !important;
left: auto !important; /* [1] */
}
.u-5\/5\@desktop-medium {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-5\/5\@desktop-medium {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-5\/5\@desktop-medium {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
}
@media (min-width: 71.875em) {
.u-1\/1\@desktop-wide {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/1\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-1\/1\@desktop-wide {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/2\@desktop-wide {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/2\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-1\/2\@desktop-wide {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-2\/2\@desktop-wide {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/2\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-2\/2\@desktop-wide {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/3\@desktop-wide {
width: 33.3333333333% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/3\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 33.3333333333% !important;
}
.u-pull-1\/3\@desktop-wide {
position: relative !important;
right: 33.3333333333% !important;
left: auto !important; /* [1] */
}
.u-2\/3\@desktop-wide {
width: 66.6666666667% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/3\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 66.6666666667% !important;
}
.u-pull-2\/3\@desktop-wide {
position: relative !important;
right: 66.6666666667% !important;
left: auto !important; /* [1] */
}
.u-3\/3\@desktop-wide {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/3\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-3\/3\@desktop-wide {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/4\@desktop-wide {
width: 25% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/4\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 25% !important;
}
.u-pull-1\/4\@desktop-wide {
position: relative !important;
right: 25% !important;
left: auto !important; /* [1] */
}
.u-2\/4\@desktop-wide {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/4\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-2\/4\@desktop-wide {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-3\/4\@desktop-wide {
width: 75% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/4\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 75% !important;
}
.u-pull-3\/4\@desktop-wide {
position: relative !important;
right: 75% !important;
left: auto !important; /* [1] */
}
.u-4\/4\@desktop-wide {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/4\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-4\/4\@desktop-wide {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/5\@desktop-wide {
width: 20% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/5\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 20% !important;
}
.u-pull-1\/5\@desktop-wide {
position: relative !important;
right: 20% !important;
left: auto !important; /* [1] */
}
.u-2\/5\@desktop-wide {
width: 40% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/5\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 40% !important;
}
.u-pull-2\/5\@desktop-wide {
position: relative !important;
right: 40% !important;
left: auto !important; /* [1] */
}
.u-3\/5\@desktop-wide {
width: 60% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/5\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 60% !important;
}
.u-pull-3\/5\@desktop-wide {
position: relative !important;
right: 60% !important;
left: auto !important; /* [1] */
}
.u-4\/5\@desktop-wide {
width: 80% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/5\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 80% !important;
}
.u-pull-4\/5\@desktop-wide {
position: relative !important;
right: 80% !important;
left: auto !important; /* [1] */
}
.u-5\/5\@desktop-wide {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-5\/5\@desktop-wide {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-5\/5\@desktop-wide {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
}
@media (min-width: 81.25em) {
.u-1\/1\@wide {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/1\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-1\/1\@wide {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/2\@wide {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/2\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-1\/2\@wide {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-2\/2\@wide {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/2\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-2\/2\@wide {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/3\@wide {
width: 33.3333333333% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/3\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 33.3333333333% !important;
}
.u-pull-1\/3\@wide {
position: relative !important;
right: 33.3333333333% !important;
left: auto !important; /* [1] */
}
.u-2\/3\@wide {
width: 66.6666666667% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/3\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 66.6666666667% !important;
}
.u-pull-2\/3\@wide {
position: relative !important;
right: 66.6666666667% !important;
left: auto !important; /* [1] */
}
.u-3\/3\@wide {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/3\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-3\/3\@wide {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/4\@wide {
width: 25% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/4\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 25% !important;
}
.u-pull-1\/4\@wide {
position: relative !important;
right: 25% !important;
left: auto !important; /* [1] */
}
.u-2\/4\@wide {
width: 50% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/4\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 50% !important;
}
.u-pull-2\/4\@wide {
position: relative !important;
right: 50% !important;
left: auto !important; /* [1] */
}
.u-3\/4\@wide {
width: 75% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/4\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 75% !important;
}
.u-pull-3\/4\@wide {
position: relative !important;
right: 75% !important;
left: auto !important; /* [1] */
}
.u-4\/4\@wide {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/4\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-4\/4\@wide {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
.u-1\/5\@wide {
width: 20% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-1\/5\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 20% !important;
}
.u-pull-1\/5\@wide {
position: relative !important;
right: 20% !important;
left: auto !important; /* [1] */
}
.u-2\/5\@wide {
width: 40% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-2\/5\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 40% !important;
}
.u-pull-2\/5\@wide {
position: relative !important;
right: 40% !important;
left: auto !important; /* [1] */
}
.u-3\/5\@wide {
width: 60% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-3\/5\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 60% !important;
}
.u-pull-3\/5\@wide {
position: relative !important;
right: 60% !important;
left: auto !important; /* [1] */
}
.u-4\/5\@wide {
width: 80% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-4\/5\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 80% !important;
}
.u-pull-4\/5\@wide {
position: relative !important;
right: 80% !important;
left: auto !important; /* [1] */
}
.u-5\/5\@wide {
width: 100% !important;
}
/**
* 1. Reset any leftover or conflicting `left`/`right` values.
*/
.u-push-5\/5\@wide {
position: relative !important;
right: auto !important; /* [1] */
left: 100% !important;
}
.u-pull-5\/5\@wide {
position: relative !important;
right: 100% !important;
left: auto !important; /* [1] */
}
}
/* ===== GUTTER UTILITY =====================================================
Author: Simon Allin | 2017 |
========================================================================== */
/* DOCUMENT INFORMATION
-Use for adding gutters to pages
¦ ¦
⟶⟶¦ ¦⟵⟵
⟶⟶¦ ¦⟵⟵
⟶⟶¦ ¦⟵⟵
⟶⟶¦ ¦⟵⟵
⟶⟶¦ ¦⟵⟵
⟶⟶¦ ¦⟵⟵
¦ ¦
*/
.u-gutter-large {
padding-left: 48px !important;
padding-right: 48px !important;
}
.u-gutter-huge {
padding-left: 96px !important;
padding-right: 96px !important;
}
.u-gutter-massive {
padding-left: 192px !important;
padding-right: 192px !important;
}
.u-gutter-none {
padding-left: 0 !important;
padding-right: 0 !important;
}
@media (max-width: 34.365em) {
.u-gutter-large-none\@mobile {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-gutter-huge-none\@mobile {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-gutter-massive-none\@mobile {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-gutter-none-none\@mobile {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-gutter-large-none\@tablet {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-gutter-huge-none\@tablet {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-gutter-massive-none\@tablet {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-gutter-none-none\@tablet {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-gutter-large-none\@medium {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-gutter-huge-none\@medium {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-gutter-massive-none\@medium {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-gutter-none-none\@medium {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-gutter-large-none\@desktop {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-gutter-huge-none\@desktop {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-gutter-massive-none\@desktop {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-gutter-none-none\@desktop {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-gutter-large-none\@desktop-medium {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-gutter-huge-none\@desktop-medium {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-gutter-massive-none\@desktop-medium {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-gutter-none-none\@desktop-medium {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-gutter-large-none\@desktop-wide {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-gutter-huge-none\@desktop-wide {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-gutter-massive-none\@desktop-wide {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-gutter-none-none\@desktop-wide {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-gutter-large-none\@wide {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-gutter-huge-none\@wide {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-gutter-massive-none\@wide {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-gutter-none-none\@wide {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
/* ==========================================================================
#HEADINGS
========================================================================== */
/**
* Redefine all of our basic heading styles against utility classes so as to
* allow for double stranded heading hierarchy, e.g. we semantically need an H2,
* but we want it to be sized like an H1:
*
*
*
*/
.u-h1 {
font-size: 36px !important;
font-size: 2.25rem !important;
line-height: 1.3333333333 !important;
}
.u-h2 {
font-size: 28px !important;
font-size: 1.75rem !important;
line-height: 1.7142857143 !important;
}
.u-h3 {
font-size: 24px !important;
font-size: 1.5rem !important;
line-height: 1 !important;
}
.u-h4 {
font-size: 20px !important;
font-size: 1.25rem !important;
line-height: 1.2 !important;
}
.u-h5 {
font-size: 18px !important;
font-size: 1.125rem !important;
line-height: 1.3333333333 !important;
}
.u-h6 {
font-size: 16px !important;
font-size: 1rem !important;
line-height: 1.5 !important;
}
/* ==========================================================================
#SPACING
========================================================================== */
/**
* Utility classes to put specific spacing values onto elements. The below loop
* will generate us a suite of classes like:
*
* .u-margin-top {}
* .u-padding-left-large {}
* .u-margin-right-small {}
* .u-padding {}
* .u-padding-right-none {}
*/
/* stylelint-disable string-quotes */
.u-padding {
padding: 24px !important;
}
.u-padding-tiny {
padding: 6px !important;
}
.u-padding-small {
padding: 12px !important;
}
.u-padding-medium {
padding: 36px !important;
}
.u-padding-large {
padding: 48px !important;
}
.u-padding-huge {
padding: 96px !important;
}
.u-padding-xxl {
padding: 144px !important;
}
.u-padding-none {
padding: 0 !important;
}
.u-padding-top {
padding-top: 24px !important;
}
.u-padding-top-tiny {
padding-top: 6px !important;
}
.u-padding-top-small {
padding-top: 12px !important;
}
.u-padding-top-medium {
padding-top: 36px !important;
}
.u-padding-top-large {
padding-top: 48px !important;
}
.u-padding-top-huge {
padding-top: 96px !important;
}
.u-padding-top-xxl {
padding-top: 144px !important;
}
.u-padding-top-none {
padding-top: 0 !important;
}
.u-padding-right {
padding-right: 24px !important;
}
.u-padding-right-tiny {
padding-right: 6px !important;
}
.u-padding-right-small {
padding-right: 12px !important;
}
.u-padding-right-medium {
padding-right: 36px !important;
}
.u-padding-right-large {
padding-right: 48px !important;
}
.u-padding-right-huge {
padding-right: 96px !important;
}
.u-padding-right-xxl {
padding-right: 144px !important;
}
.u-padding-right-none {
padding-right: 0 !important;
}
.u-padding-bottom {
padding-bottom: 24px !important;
}
.u-padding-bottom-tiny {
padding-bottom: 6px !important;
}
.u-padding-bottom-small {
padding-bottom: 12px !important;
}
.u-padding-bottom-medium {
padding-bottom: 36px !important;
}
.u-padding-bottom-large {
padding-bottom: 48px !important;
}
.u-padding-bottom-huge {
padding-bottom: 96px !important;
}
.u-padding-bottom-xxl {
padding-bottom: 144px !important;
}
.u-padding-bottom-none {
padding-bottom: 0 !important;
}
.u-padding-left {
padding-left: 24px !important;
}
.u-padding-left-tiny {
padding-left: 6px !important;
}
.u-padding-left-small {
padding-left: 12px !important;
}
.u-padding-left-medium {
padding-left: 36px !important;
}
.u-padding-left-large {
padding-left: 48px !important;
}
.u-padding-left-huge {
padding-left: 96px !important;
}
.u-padding-left-xxl {
padding-left: 144px !important;
}
.u-padding-left-none {
padding-left: 0 !important;
}
.u-margin {
margin: 24px !important;
}
.u-margin-tiny {
margin: 6px !important;
}
.u-margin-small {
margin: 12px !important;
}
.u-margin-medium {
margin: 36px !important;
}
.u-margin-large {
margin: 48px !important;
}
.u-margin-huge {
margin: 96px !important;
}
.u-margin-xxl {
margin: 144px !important;
}
.u-margin-none {
margin: 0 !important;
}
.u-margin-top {
margin-top: 24px !important;
}
.u-margin-top-tiny {
margin-top: 6px !important;
}
.u-margin-top-small {
margin-top: 12px !important;
}
.u-margin-top-medium {
margin-top: 36px !important;
}
.u-margin-top-large {
margin-top: 48px !important;
}
.u-margin-top-huge {
margin-top: 96px !important;
}
.u-margin-top-xxl {
margin-top: 144px !important;
}
.u-margin-top-none {
margin-top: 0 !important;
}
.u-margin-right {
margin-right: 24px !important;
}
.u-margin-right-tiny {
margin-right: 6px !important;
}
.u-margin-right-small {
margin-right: 12px !important;
}
.u-margin-right-medium {
margin-right: 36px !important;
}
.u-margin-right-large {
margin-right: 48px !important;
}
.u-margin-right-huge {
margin-right: 96px !important;
}
.u-margin-right-xxl {
margin-right: 144px !important;
}
.u-margin-right-none {
margin-right: 0 !important;
}
.u-margin-bottom {
margin-bottom: 24px !important;
}
.u-margin-bottom-tiny {
margin-bottom: 6px !important;
}
.u-margin-bottom-small {
margin-bottom: 12px !important;
}
.u-margin-bottom-medium {
margin-bottom: 36px !important;
}
.u-margin-bottom-large {
margin-bottom: 48px !important;
}
.u-margin-bottom-huge {
margin-bottom: 96px !important;
}
.u-margin-bottom-xxl {
margin-bottom: 144px !important;
}
.u-margin-bottom-none {
margin-bottom: 0 !important;
}
.u-margin-left {
margin-left: 24px !important;
}
.u-margin-left-tiny {
margin-left: 6px !important;
}
.u-margin-left-small {
margin-left: 12px !important;
}
.u-margin-left-medium {
margin-left: 36px !important;
}
.u-margin-left-large {
margin-left: 48px !important;
}
.u-margin-left-huge {
margin-left: 96px !important;
}
.u-margin-left-xxl {
margin-left: 144px !important;
}
.u-margin-left-none {
margin-left: 0 !important;
}
@media (max-width: 34.365em) {
.u-padding-none\@mobile {
padding: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-padding-top-none\@mobile {
padding-top: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-padding-right-none\@mobile {
padding-right: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-padding-bottom-none\@mobile {
padding-bottom: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-padding-left-none\@mobile {
padding-left: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-margin-none\@mobile {
margin: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-margin-top-none\@mobile {
margin-top: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-margin-right-none\@mobile {
margin-right: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-margin-bottom-none\@mobile {
margin-bottom: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-margin-left-none\@mobile {
margin-left: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-padding-none\@tablet {
padding: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-padding-top-none\@tablet {
padding-top: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-padding-right-none\@tablet {
padding-right: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-padding-bottom-none\@tablet {
padding-bottom: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-padding-left-none\@tablet {
padding-left: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-margin-none\@tablet {
margin: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-margin-top-none\@tablet {
margin-top: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-margin-right-none\@tablet {
margin-right: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-margin-bottom-none\@tablet {
margin-bottom: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-margin-left-none\@tablet {
margin-left: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-padding-none\@medium {
padding: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-padding-top-none\@medium {
padding-top: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-padding-right-none\@medium {
padding-right: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-padding-bottom-none\@medium {
padding-bottom: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-padding-left-none\@medium {
padding-left: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-margin-none\@medium {
margin: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-margin-top-none\@medium {
margin-top: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-margin-right-none\@medium {
margin-right: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-margin-bottom-none\@medium {
margin-bottom: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-margin-left-none\@medium {
margin-left: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-padding-none\@desktop {
padding: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-padding-top-none\@desktop {
padding-top: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-padding-right-none\@desktop {
padding-right: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-padding-bottom-none\@desktop {
padding-bottom: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-padding-left-none\@desktop {
padding-left: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-margin-none\@desktop {
margin: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-margin-top-none\@desktop {
margin-top: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-margin-right-none\@desktop {
margin-right: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-margin-bottom-none\@desktop {
margin-bottom: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-margin-left-none\@desktop {
margin-left: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-padding-none\@desktop-medium {
padding: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-padding-top-none\@desktop-medium {
padding-top: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-padding-right-none\@desktop-medium {
padding-right: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-padding-bottom-none\@desktop-medium {
padding-bottom: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-padding-left-none\@desktop-medium {
padding-left: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-margin-none\@desktop-medium {
margin: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-margin-top-none\@desktop-medium {
margin-top: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-margin-right-none\@desktop-medium {
margin-right: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-margin-bottom-none\@desktop-medium {
margin-bottom: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-margin-left-none\@desktop-medium {
margin-left: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-padding-none\@desktop-wide {
padding: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-padding-top-none\@desktop-wide {
padding-top: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-padding-right-none\@desktop-wide {
padding-right: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-padding-bottom-none\@desktop-wide {
padding-bottom: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-padding-left-none\@desktop-wide {
padding-left: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-margin-none\@desktop-wide {
margin: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-margin-top-none\@desktop-wide {
margin-top: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-margin-right-none\@desktop-wide {
margin-right: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-margin-bottom-none\@desktop-wide {
margin-bottom: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-margin-left-none\@desktop-wide {
margin-left: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-padding-none\@wide {
padding: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-padding-top-none\@wide {
padding-top: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-padding-right-none\@wide {
padding-right: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-padding-bottom-none\@wide {
padding-bottom: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-padding-left-none\@wide {
padding-left: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-margin-none\@wide {
margin: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-margin-top-none\@wide {
margin-top: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-margin-right-none\@wide {
margin-right: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-margin-bottom-none\@wide {
margin-bottom: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-margin-left-none\@wide {
margin-left: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-padding\@mobile {
padding: 24px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-tiny\@mobile {
padding: 6px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-small\@mobile {
padding: 12px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-medium\@mobile {
padding: 36px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-large\@mobile {
padding: 48px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-huge\@mobile {
padding: 96px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-xxl\@mobile {
padding: 144px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-none\@mobile {
padding: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-padding-top\@mobile {
padding-top: 24px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-top-tiny\@mobile {
padding-top: 6px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-top-small\@mobile {
padding-top: 12px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-top-medium\@mobile {
padding-top: 36px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-top-large\@mobile {
padding-top: 48px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-top-huge\@mobile {
padding-top: 96px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-top-xxl\@mobile {
padding-top: 144px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-top-none\@mobile {
padding-top: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-padding-right\@mobile {
padding-right: 24px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-right-tiny\@mobile {
padding-right: 6px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-right-small\@mobile {
padding-right: 12px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-right-medium\@mobile {
padding-right: 36px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-right-large\@mobile {
padding-right: 48px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-right-huge\@mobile {
padding-right: 96px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-right-xxl\@mobile {
padding-right: 144px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-right-none\@mobile {
padding-right: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-padding-bottom\@mobile {
padding-bottom: 24px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-bottom-tiny\@mobile {
padding-bottom: 6px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-bottom-small\@mobile {
padding-bottom: 12px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-bottom-medium\@mobile {
padding-bottom: 36px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-bottom-large\@mobile {
padding-bottom: 48px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-bottom-huge\@mobile {
padding-bottom: 96px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-bottom-xxl\@mobile {
padding-bottom: 144px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-bottom-none\@mobile {
padding-bottom: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-padding-left\@mobile {
padding-left: 24px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-left-tiny\@mobile {
padding-left: 6px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-left-small\@mobile {
padding-left: 12px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-left-medium\@mobile {
padding-left: 36px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-left-large\@mobile {
padding-left: 48px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-left-huge\@mobile {
padding-left: 96px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-left-xxl\@mobile {
padding-left: 144px !important;
}
}
@media (max-width: 34.365em) {
.u-padding-left-none\@mobile {
padding-left: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-margin\@mobile {
margin: 24px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-tiny\@mobile {
margin: 6px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-small\@mobile {
margin: 12px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-medium\@mobile {
margin: 36px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-large\@mobile {
margin: 48px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-huge\@mobile {
margin: 96px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-xxl\@mobile {
margin: 144px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-none\@mobile {
margin: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-margin-top\@mobile {
margin-top: 24px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-top-tiny\@mobile {
margin-top: 6px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-top-small\@mobile {
margin-top: 12px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-top-medium\@mobile {
margin-top: 36px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-top-large\@mobile {
margin-top: 48px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-top-huge\@mobile {
margin-top: 96px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-top-xxl\@mobile {
margin-top: 144px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-top-none\@mobile {
margin-top: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-margin-right\@mobile {
margin-right: 24px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-right-tiny\@mobile {
margin-right: 6px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-right-small\@mobile {
margin-right: 12px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-right-medium\@mobile {
margin-right: 36px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-right-large\@mobile {
margin-right: 48px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-right-huge\@mobile {
margin-right: 96px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-right-xxl\@mobile {
margin-right: 144px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-right-none\@mobile {
margin-right: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-margin-bottom\@mobile {
margin-bottom: 24px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-bottom-tiny\@mobile {
margin-bottom: 6px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-bottom-small\@mobile {
margin-bottom: 12px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-bottom-medium\@mobile {
margin-bottom: 36px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-bottom-large\@mobile {
margin-bottom: 48px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-bottom-huge\@mobile {
margin-bottom: 96px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-bottom-xxl\@mobile {
margin-bottom: 144px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-bottom-none\@mobile {
margin-bottom: 0 !important;
}
}
@media (max-width: 34.365em) {
.u-margin-left\@mobile {
margin-left: 24px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-left-tiny\@mobile {
margin-left: 6px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-left-small\@mobile {
margin-left: 12px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-left-medium\@mobile {
margin-left: 36px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-left-large\@mobile {
margin-left: 48px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-left-huge\@mobile {
margin-left: 96px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-left-xxl\@mobile {
margin-left: 144px !important;
}
}
@media (max-width: 34.365em) {
.u-margin-left-none\@mobile {
margin-left: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-padding\@tablet {
padding: 24px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-tiny\@tablet {
padding: 6px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-small\@tablet {
padding: 12px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-medium\@tablet {
padding: 36px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-large\@tablet {
padding: 48px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-huge\@tablet {
padding: 96px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-xxl\@tablet {
padding: 144px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-none\@tablet {
padding: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-padding-top\@tablet {
padding-top: 24px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-top-tiny\@tablet {
padding-top: 6px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-top-small\@tablet {
padding-top: 12px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-top-medium\@tablet {
padding-top: 36px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-top-large\@tablet {
padding-top: 48px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-top-huge\@tablet {
padding-top: 96px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-top-xxl\@tablet {
padding-top: 144px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-top-none\@tablet {
padding-top: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-padding-right\@tablet {
padding-right: 24px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-right-tiny\@tablet {
padding-right: 6px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-right-small\@tablet {
padding-right: 12px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-right-medium\@tablet {
padding-right: 36px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-right-large\@tablet {
padding-right: 48px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-right-huge\@tablet {
padding-right: 96px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-right-xxl\@tablet {
padding-right: 144px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-right-none\@tablet {
padding-right: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-padding-bottom\@tablet {
padding-bottom: 24px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-bottom-tiny\@tablet {
padding-bottom: 6px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-bottom-small\@tablet {
padding-bottom: 12px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-bottom-medium\@tablet {
padding-bottom: 36px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-bottom-large\@tablet {
padding-bottom: 48px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-bottom-huge\@tablet {
padding-bottom: 96px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-bottom-xxl\@tablet {
padding-bottom: 144px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-bottom-none\@tablet {
padding-bottom: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-padding-left\@tablet {
padding-left: 24px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-left-tiny\@tablet {
padding-left: 6px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-left-small\@tablet {
padding-left: 12px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-left-medium\@tablet {
padding-left: 36px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-left-large\@tablet {
padding-left: 48px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-left-huge\@tablet {
padding-left: 96px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-left-xxl\@tablet {
padding-left: 144px !important;
}
}
@media (max-width: 46.24em) {
.u-padding-left-none\@tablet {
padding-left: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-margin\@tablet {
margin: 24px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-tiny\@tablet {
margin: 6px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-small\@tablet {
margin: 12px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-medium\@tablet {
margin: 36px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-large\@tablet {
margin: 48px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-huge\@tablet {
margin: 96px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-xxl\@tablet {
margin: 144px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-none\@tablet {
margin: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-margin-top\@tablet {
margin-top: 24px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-top-tiny\@tablet {
margin-top: 6px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-top-small\@tablet {
margin-top: 12px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-top-medium\@tablet {
margin-top: 36px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-top-large\@tablet {
margin-top: 48px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-top-huge\@tablet {
margin-top: 96px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-top-xxl\@tablet {
margin-top: 144px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-top-none\@tablet {
margin-top: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-margin-right\@tablet {
margin-right: 24px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-right-tiny\@tablet {
margin-right: 6px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-right-small\@tablet {
margin-right: 12px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-right-medium\@tablet {
margin-right: 36px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-right-large\@tablet {
margin-right: 48px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-right-huge\@tablet {
margin-right: 96px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-right-xxl\@tablet {
margin-right: 144px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-right-none\@tablet {
margin-right: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-margin-bottom\@tablet {
margin-bottom: 24px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-bottom-tiny\@tablet {
margin-bottom: 6px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-bottom-small\@tablet {
margin-bottom: 12px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-bottom-medium\@tablet {
margin-bottom: 36px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-bottom-large\@tablet {
margin-bottom: 48px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-bottom-huge\@tablet {
margin-bottom: 96px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-bottom-xxl\@tablet {
margin-bottom: 144px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-bottom-none\@tablet {
margin-bottom: 0 !important;
}
}
@media (max-width: 46.24em) {
.u-margin-left\@tablet {
margin-left: 24px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-left-tiny\@tablet {
margin-left: 6px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-left-small\@tablet {
margin-left: 12px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-left-medium\@tablet {
margin-left: 36px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-left-large\@tablet {
margin-left: 48px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-left-huge\@tablet {
margin-left: 96px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-left-xxl\@tablet {
margin-left: 144px !important;
}
}
@media (max-width: 46.24em) {
.u-margin-left-none\@tablet {
margin-left: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-padding\@medium {
padding: 24px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-tiny\@medium {
padding: 6px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-small\@medium {
padding: 12px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-medium\@medium {
padding: 36px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-large\@medium {
padding: 48px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-huge\@medium {
padding: 96px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-xxl\@medium {
padding: 144px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-none\@medium {
padding: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-padding-top\@medium {
padding-top: 24px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-top-tiny\@medium {
padding-top: 6px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-top-small\@medium {
padding-top: 12px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-top-medium\@medium {
padding-top: 36px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-top-large\@medium {
padding-top: 48px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-top-huge\@medium {
padding-top: 96px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-top-xxl\@medium {
padding-top: 144px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-top-none\@medium {
padding-top: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-padding-right\@medium {
padding-right: 24px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-right-tiny\@medium {
padding-right: 6px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-right-small\@medium {
padding-right: 12px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-right-medium\@medium {
padding-right: 36px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-right-large\@medium {
padding-right: 48px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-right-huge\@medium {
padding-right: 96px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-right-xxl\@medium {
padding-right: 144px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-right-none\@medium {
padding-right: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-padding-bottom\@medium {
padding-bottom: 24px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-bottom-tiny\@medium {
padding-bottom: 6px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-bottom-small\@medium {
padding-bottom: 12px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-bottom-medium\@medium {
padding-bottom: 36px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-bottom-large\@medium {
padding-bottom: 48px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-bottom-huge\@medium {
padding-bottom: 96px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-bottom-xxl\@medium {
padding-bottom: 144px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-bottom-none\@medium {
padding-bottom: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-padding-left\@medium {
padding-left: 24px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-left-tiny\@medium {
padding-left: 6px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-left-small\@medium {
padding-left: 12px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-left-medium\@medium {
padding-left: 36px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-left-large\@medium {
padding-left: 48px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-left-huge\@medium {
padding-left: 96px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-left-xxl\@medium {
padding-left: 144px !important;
}
}
@media (max-width: 52.49em) {
.u-padding-left-none\@medium {
padding-left: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-margin\@medium {
margin: 24px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-tiny\@medium {
margin: 6px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-small\@medium {
margin: 12px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-medium\@medium {
margin: 36px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-large\@medium {
margin: 48px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-huge\@medium {
margin: 96px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-xxl\@medium {
margin: 144px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-none\@medium {
margin: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-margin-top\@medium {
margin-top: 24px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-top-tiny\@medium {
margin-top: 6px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-top-small\@medium {
margin-top: 12px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-top-medium\@medium {
margin-top: 36px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-top-large\@medium {
margin-top: 48px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-top-huge\@medium {
margin-top: 96px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-top-xxl\@medium {
margin-top: 144px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-top-none\@medium {
margin-top: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-margin-right\@medium {
margin-right: 24px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-right-tiny\@medium {
margin-right: 6px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-right-small\@medium {
margin-right: 12px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-right-medium\@medium {
margin-right: 36px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-right-large\@medium {
margin-right: 48px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-right-huge\@medium {
margin-right: 96px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-right-xxl\@medium {
margin-right: 144px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-right-none\@medium {
margin-right: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-margin-bottom\@medium {
margin-bottom: 24px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-bottom-tiny\@medium {
margin-bottom: 6px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-bottom-small\@medium {
margin-bottom: 12px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-bottom-medium\@medium {
margin-bottom: 36px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-bottom-large\@medium {
margin-bottom: 48px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-bottom-huge\@medium {
margin-bottom: 96px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-bottom-xxl\@medium {
margin-bottom: 144px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-bottom-none\@medium {
margin-bottom: 0 !important;
}
}
@media (max-width: 52.49em) {
.u-margin-left\@medium {
margin-left: 24px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-left-tiny\@medium {
margin-left: 6px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-left-small\@medium {
margin-left: 12px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-left-medium\@medium {
margin-left: 36px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-left-large\@medium {
margin-left: 48px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-left-huge\@medium {
margin-left: 96px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-left-xxl\@medium {
margin-left: 144px !important;
}
}
@media (max-width: 52.49em) {
.u-margin-left-none\@medium {
margin-left: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-padding\@desktop {
padding: 24px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-tiny\@desktop {
padding: 6px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-small\@desktop {
padding: 12px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-medium\@desktop {
padding: 36px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-large\@desktop {
padding: 48px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-huge\@desktop {
padding: 96px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-xxl\@desktop {
padding: 144px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-none\@desktop {
padding: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-padding-top\@desktop {
padding-top: 24px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-top-tiny\@desktop {
padding-top: 6px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-top-small\@desktop {
padding-top: 12px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-top-medium\@desktop {
padding-top: 36px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-top-large\@desktop {
padding-top: 48px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-top-huge\@desktop {
padding-top: 96px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-top-xxl\@desktop {
padding-top: 144px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-top-none\@desktop {
padding-top: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-padding-right\@desktop {
padding-right: 24px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-right-tiny\@desktop {
padding-right: 6px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-right-small\@desktop {
padding-right: 12px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-right-medium\@desktop {
padding-right: 36px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-right-large\@desktop {
padding-right: 48px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-right-huge\@desktop {
padding-right: 96px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-right-xxl\@desktop {
padding-right: 144px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-right-none\@desktop {
padding-right: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-padding-bottom\@desktop {
padding-bottom: 24px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-bottom-tiny\@desktop {
padding-bottom: 6px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-bottom-small\@desktop {
padding-bottom: 12px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-bottom-medium\@desktop {
padding-bottom: 36px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-bottom-large\@desktop {
padding-bottom: 48px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-bottom-huge\@desktop {
padding-bottom: 96px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-bottom-xxl\@desktop {
padding-bottom: 144px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-bottom-none\@desktop {
padding-bottom: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-padding-left\@desktop {
padding-left: 24px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-left-tiny\@desktop {
padding-left: 6px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-left-small\@desktop {
padding-left: 12px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-left-medium\@desktop {
padding-left: 36px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-left-large\@desktop {
padding-left: 48px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-left-huge\@desktop {
padding-left: 96px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-left-xxl\@desktop {
padding-left: 144px !important;
}
}
@media (max-width: 61.24em) {
.u-padding-left-none\@desktop {
padding-left: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-margin\@desktop {
margin: 24px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-tiny\@desktop {
margin: 6px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-small\@desktop {
margin: 12px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-medium\@desktop {
margin: 36px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-large\@desktop {
margin: 48px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-huge\@desktop {
margin: 96px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-xxl\@desktop {
margin: 144px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-none\@desktop {
margin: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-margin-top\@desktop {
margin-top: 24px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-top-tiny\@desktop {
margin-top: 6px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-top-small\@desktop {
margin-top: 12px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-top-medium\@desktop {
margin-top: 36px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-top-large\@desktop {
margin-top: 48px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-top-huge\@desktop {
margin-top: 96px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-top-xxl\@desktop {
margin-top: 144px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-top-none\@desktop {
margin-top: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-margin-right\@desktop {
margin-right: 24px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-right-tiny\@desktop {
margin-right: 6px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-right-small\@desktop {
margin-right: 12px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-right-medium\@desktop {
margin-right: 36px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-right-large\@desktop {
margin-right: 48px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-right-huge\@desktop {
margin-right: 96px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-right-xxl\@desktop {
margin-right: 144px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-right-none\@desktop {
margin-right: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-margin-bottom\@desktop {
margin-bottom: 24px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-bottom-tiny\@desktop {
margin-bottom: 6px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-bottom-small\@desktop {
margin-bottom: 12px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-bottom-medium\@desktop {
margin-bottom: 36px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-bottom-large\@desktop {
margin-bottom: 48px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-bottom-huge\@desktop {
margin-bottom: 96px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-bottom-xxl\@desktop {
margin-bottom: 144px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-bottom-none\@desktop {
margin-bottom: 0 !important;
}
}
@media (max-width: 61.24em) {
.u-margin-left\@desktop {
margin-left: 24px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-left-tiny\@desktop {
margin-left: 6px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-left-small\@desktop {
margin-left: 12px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-left-medium\@desktop {
margin-left: 36px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-left-large\@desktop {
margin-left: 48px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-left-huge\@desktop {
margin-left: 96px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-left-xxl\@desktop {
margin-left: 144px !important;
}
}
@media (max-width: 61.24em) {
.u-margin-left-none\@desktop {
margin-left: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-padding\@desktop-medium {
padding: 24px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-tiny\@desktop-medium {
padding: 6px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-small\@desktop-medium {
padding: 12px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-medium\@desktop-medium {
padding: 36px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-large\@desktop-medium {
padding: 48px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-huge\@desktop-medium {
padding: 96px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-xxl\@desktop-medium {
padding: 144px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-none\@desktop-medium {
padding: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-padding-top\@desktop-medium {
padding-top: 24px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-top-tiny\@desktop-medium {
padding-top: 6px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-top-small\@desktop-medium {
padding-top: 12px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-top-medium\@desktop-medium {
padding-top: 36px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-top-large\@desktop-medium {
padding-top: 48px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-top-huge\@desktop-medium {
padding-top: 96px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-top-xxl\@desktop-medium {
padding-top: 144px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-top-none\@desktop-medium {
padding-top: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-padding-right\@desktop-medium {
padding-right: 24px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-right-tiny\@desktop-medium {
padding-right: 6px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-right-small\@desktop-medium {
padding-right: 12px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-right-medium\@desktop-medium {
padding-right: 36px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-right-large\@desktop-medium {
padding-right: 48px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-right-huge\@desktop-medium {
padding-right: 96px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-right-xxl\@desktop-medium {
padding-right: 144px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-right-none\@desktop-medium {
padding-right: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-padding-bottom\@desktop-medium {
padding-bottom: 24px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-bottom-tiny\@desktop-medium {
padding-bottom: 6px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-bottom-small\@desktop-medium {
padding-bottom: 12px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-bottom-medium\@desktop-medium {
padding-bottom: 36px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-bottom-large\@desktop-medium {
padding-bottom: 48px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-bottom-huge\@desktop-medium {
padding-bottom: 96px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-bottom-xxl\@desktop-medium {
padding-bottom: 144px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-bottom-none\@desktop-medium {
padding-bottom: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-padding-left\@desktop-medium {
padding-left: 24px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-left-tiny\@desktop-medium {
padding-left: 6px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-left-small\@desktop-medium {
padding-left: 12px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-left-medium\@desktop-medium {
padding-left: 36px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-left-large\@desktop-medium {
padding-left: 48px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-left-huge\@desktop-medium {
padding-left: 96px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-left-xxl\@desktop-medium {
padding-left: 144px !important;
}
}
@media (max-width: 63.99em) {
.u-padding-left-none\@desktop-medium {
padding-left: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-margin\@desktop-medium {
margin: 24px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-tiny\@desktop-medium {
margin: 6px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-small\@desktop-medium {
margin: 12px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-medium\@desktop-medium {
margin: 36px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-large\@desktop-medium {
margin: 48px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-huge\@desktop-medium {
margin: 96px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-xxl\@desktop-medium {
margin: 144px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-none\@desktop-medium {
margin: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-margin-top\@desktop-medium {
margin-top: 24px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-top-tiny\@desktop-medium {
margin-top: 6px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-top-small\@desktop-medium {
margin-top: 12px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-top-medium\@desktop-medium {
margin-top: 36px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-top-large\@desktop-medium {
margin-top: 48px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-top-huge\@desktop-medium {
margin-top: 96px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-top-xxl\@desktop-medium {
margin-top: 144px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-top-none\@desktop-medium {
margin-top: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-margin-right\@desktop-medium {
margin-right: 24px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-right-tiny\@desktop-medium {
margin-right: 6px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-right-small\@desktop-medium {
margin-right: 12px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-right-medium\@desktop-medium {
margin-right: 36px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-right-large\@desktop-medium {
margin-right: 48px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-right-huge\@desktop-medium {
margin-right: 96px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-right-xxl\@desktop-medium {
margin-right: 144px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-right-none\@desktop-medium {
margin-right: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-margin-bottom\@desktop-medium {
margin-bottom: 24px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-bottom-tiny\@desktop-medium {
margin-bottom: 6px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-bottom-small\@desktop-medium {
margin-bottom: 12px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-bottom-medium\@desktop-medium {
margin-bottom: 36px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-bottom-large\@desktop-medium {
margin-bottom: 48px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-bottom-huge\@desktop-medium {
margin-bottom: 96px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-bottom-xxl\@desktop-medium {
margin-bottom: 144px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-bottom-none\@desktop-medium {
margin-bottom: 0 !important;
}
}
@media (max-width: 63.99em) {
.u-margin-left\@desktop-medium {
margin-left: 24px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-left-tiny\@desktop-medium {
margin-left: 6px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-left-small\@desktop-medium {
margin-left: 12px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-left-medium\@desktop-medium {
margin-left: 36px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-left-large\@desktop-medium {
margin-left: 48px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-left-huge\@desktop-medium {
margin-left: 96px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-left-xxl\@desktop-medium {
margin-left: 144px !important;
}
}
@media (max-width: 63.99em) {
.u-margin-left-none\@desktop-medium {
margin-left: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-padding\@desktop-wide {
padding: 24px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-tiny\@desktop-wide {
padding: 6px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-small\@desktop-wide {
padding: 12px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-medium\@desktop-wide {
padding: 36px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-large\@desktop-wide {
padding: 48px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-huge\@desktop-wide {
padding: 96px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-xxl\@desktop-wide {
padding: 144px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-none\@desktop-wide {
padding: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-padding-top\@desktop-wide {
padding-top: 24px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-top-tiny\@desktop-wide {
padding-top: 6px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-top-small\@desktop-wide {
padding-top: 12px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-top-medium\@desktop-wide {
padding-top: 36px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-top-large\@desktop-wide {
padding-top: 48px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-top-huge\@desktop-wide {
padding-top: 96px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-top-xxl\@desktop-wide {
padding-top: 144px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-top-none\@desktop-wide {
padding-top: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-padding-right\@desktop-wide {
padding-right: 24px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-right-tiny\@desktop-wide {
padding-right: 6px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-right-small\@desktop-wide {
padding-right: 12px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-right-medium\@desktop-wide {
padding-right: 36px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-right-large\@desktop-wide {
padding-right: 48px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-right-huge\@desktop-wide {
padding-right: 96px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-right-xxl\@desktop-wide {
padding-right: 144px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-right-none\@desktop-wide {
padding-right: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-padding-bottom\@desktop-wide {
padding-bottom: 24px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-bottom-tiny\@desktop-wide {
padding-bottom: 6px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-bottom-small\@desktop-wide {
padding-bottom: 12px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-bottom-medium\@desktop-wide {
padding-bottom: 36px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-bottom-large\@desktop-wide {
padding-bottom: 48px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-bottom-huge\@desktop-wide {
padding-bottom: 96px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-bottom-xxl\@desktop-wide {
padding-bottom: 144px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-bottom-none\@desktop-wide {
padding-bottom: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-padding-left\@desktop-wide {
padding-left: 24px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-left-tiny\@desktop-wide {
padding-left: 6px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-left-small\@desktop-wide {
padding-left: 12px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-left-medium\@desktop-wide {
padding-left: 36px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-left-large\@desktop-wide {
padding-left: 48px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-left-huge\@desktop-wide {
padding-left: 96px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-left-xxl\@desktop-wide {
padding-left: 144px !important;
}
}
@media (max-width: 71.865em) {
.u-padding-left-none\@desktop-wide {
padding-left: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-margin\@desktop-wide {
margin: 24px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-tiny\@desktop-wide {
margin: 6px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-small\@desktop-wide {
margin: 12px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-medium\@desktop-wide {
margin: 36px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-large\@desktop-wide {
margin: 48px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-huge\@desktop-wide {
margin: 96px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-xxl\@desktop-wide {
margin: 144px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-none\@desktop-wide {
margin: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-margin-top\@desktop-wide {
margin-top: 24px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-top-tiny\@desktop-wide {
margin-top: 6px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-top-small\@desktop-wide {
margin-top: 12px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-top-medium\@desktop-wide {
margin-top: 36px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-top-large\@desktop-wide {
margin-top: 48px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-top-huge\@desktop-wide {
margin-top: 96px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-top-xxl\@desktop-wide {
margin-top: 144px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-top-none\@desktop-wide {
margin-top: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-margin-right\@desktop-wide {
margin-right: 24px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-right-tiny\@desktop-wide {
margin-right: 6px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-right-small\@desktop-wide {
margin-right: 12px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-right-medium\@desktop-wide {
margin-right: 36px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-right-large\@desktop-wide {
margin-right: 48px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-right-huge\@desktop-wide {
margin-right: 96px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-right-xxl\@desktop-wide {
margin-right: 144px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-right-none\@desktop-wide {
margin-right: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-margin-bottom\@desktop-wide {
margin-bottom: 24px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-bottom-tiny\@desktop-wide {
margin-bottom: 6px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-bottom-small\@desktop-wide {
margin-bottom: 12px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-bottom-medium\@desktop-wide {
margin-bottom: 36px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-bottom-large\@desktop-wide {
margin-bottom: 48px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-bottom-huge\@desktop-wide {
margin-bottom: 96px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-bottom-xxl\@desktop-wide {
margin-bottom: 144px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-bottom-none\@desktop-wide {
margin-bottom: 0 !important;
}
}
@media (max-width: 71.865em) {
.u-margin-left\@desktop-wide {
margin-left: 24px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-left-tiny\@desktop-wide {
margin-left: 6px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-left-small\@desktop-wide {
margin-left: 12px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-left-medium\@desktop-wide {
margin-left: 36px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-left-large\@desktop-wide {
margin-left: 48px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-left-huge\@desktop-wide {
margin-left: 96px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-left-xxl\@desktop-wide {
margin-left: 144px !important;
}
}
@media (max-width: 71.865em) {
.u-margin-left-none\@desktop-wide {
margin-left: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-padding\@wide {
padding: 24px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-tiny\@wide {
padding: 6px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-small\@wide {
padding: 12px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-medium\@wide {
padding: 36px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-large\@wide {
padding: 48px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-huge\@wide {
padding: 96px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-xxl\@wide {
padding: 144px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-none\@wide {
padding: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-padding-top\@wide {
padding-top: 24px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-top-tiny\@wide {
padding-top: 6px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-top-small\@wide {
padding-top: 12px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-top-medium\@wide {
padding-top: 36px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-top-large\@wide {
padding-top: 48px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-top-huge\@wide {
padding-top: 96px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-top-xxl\@wide {
padding-top: 144px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-top-none\@wide {
padding-top: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-padding-right\@wide {
padding-right: 24px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-right-tiny\@wide {
padding-right: 6px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-right-small\@wide {
padding-right: 12px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-right-medium\@wide {
padding-right: 36px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-right-large\@wide {
padding-right: 48px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-right-huge\@wide {
padding-right: 96px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-right-xxl\@wide {
padding-right: 144px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-right-none\@wide {
padding-right: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-padding-bottom\@wide {
padding-bottom: 24px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-bottom-tiny\@wide {
padding-bottom: 6px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-bottom-small\@wide {
padding-bottom: 12px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-bottom-medium\@wide {
padding-bottom: 36px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-bottom-large\@wide {
padding-bottom: 48px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-bottom-huge\@wide {
padding-bottom: 96px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-bottom-xxl\@wide {
padding-bottom: 144px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-bottom-none\@wide {
padding-bottom: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-padding-left\@wide {
padding-left: 24px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-left-tiny\@wide {
padding-left: 6px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-left-small\@wide {
padding-left: 12px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-left-medium\@wide {
padding-left: 36px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-left-large\@wide {
padding-left: 48px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-left-huge\@wide {
padding-left: 96px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-left-xxl\@wide {
padding-left: 144px !important;
}
}
@media (max-width: 81.24em) {
.u-padding-left-none\@wide {
padding-left: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-margin\@wide {
margin: 24px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-tiny\@wide {
margin: 6px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-small\@wide {
margin: 12px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-medium\@wide {
margin: 36px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-large\@wide {
margin: 48px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-huge\@wide {
margin: 96px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-xxl\@wide {
margin: 144px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-none\@wide {
margin: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-margin-top\@wide {
margin-top: 24px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-top-tiny\@wide {
margin-top: 6px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-top-small\@wide {
margin-top: 12px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-top-medium\@wide {
margin-top: 36px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-top-large\@wide {
margin-top: 48px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-top-huge\@wide {
margin-top: 96px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-top-xxl\@wide {
margin-top: 144px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-top-none\@wide {
margin-top: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-margin-right\@wide {
margin-right: 24px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-right-tiny\@wide {
margin-right: 6px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-right-small\@wide {
margin-right: 12px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-right-medium\@wide {
margin-right: 36px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-right-large\@wide {
margin-right: 48px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-right-huge\@wide {
margin-right: 96px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-right-xxl\@wide {
margin-right: 144px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-right-none\@wide {
margin-right: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-margin-bottom\@wide {
margin-bottom: 24px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-bottom-tiny\@wide {
margin-bottom: 6px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-bottom-small\@wide {
margin-bottom: 12px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-bottom-medium\@wide {
margin-bottom: 36px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-bottom-large\@wide {
margin-bottom: 48px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-bottom-huge\@wide {
margin-bottom: 96px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-bottom-xxl\@wide {
margin-bottom: 144px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-bottom-none\@wide {
margin-bottom: 0 !important;
}
}
@media (max-width: 81.24em) {
.u-margin-left\@wide {
margin-left: 24px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-left-tiny\@wide {
margin-left: 6px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-left-small\@wide {
margin-left: 12px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-left-medium\@wide {
margin-left: 36px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-left-large\@wide {
margin-left: 48px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-left-huge\@wide {
margin-left: 96px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-left-xxl\@wide {
margin-left: 144px !important;
}
}
@media (max-width: 81.24em) {
.u-margin-left-none\@wide {
margin-left: 0 !important;
}
}
/* stylelint-enable string-quotes */
/* ==========================================================================
#PRINT
========================================================================== */
/**
* Very crude, reset-like styles taken from the HTML5 Boilerplate:
* https://github.com/h5bp/html5-boilerplate/blob/5.3.0/dist/doc/css.md#print-styles
* https://github.com/h5bp/html5-boilerplate/blob/master/dist/css/main.css#L205-L282
*/
@media print {
/**
* 1. Black prints faster: http://www.sanbeiji.com/archives/953
*/
*,
*:before,
*:after,
*:first-letter,
*:first-line {
background: transparent !important;
color: #000 !important; /* [1] */
box-shadow: none !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
/**
* Don't show links that are fragment identifiers, or use the `javascript:`
* pseudo protocol.
*/
a[href^="#"]:after,
a[href^="javascript:"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
/**
* Printing Tables: http://css-discuss.incutio.com/wiki/Printing_Tables
*/
thead {
display: table-header-group;
}
tr,
img {
page-break-inside: avoid;
}
img {
max-width: 100% !important;
}
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 {
page-break-after: avoid;
}
}
/* ==========================================================================
#HIDE
========================================================================== */
/**
* Hide only visually, but have it available for screen readers:
* http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*/
.u-hidden-visually {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
/**
* Hide visually and from screen readers.
*/
.u-hidden {
display: none !important;
}
.u-hidden-js {
display: none;
}
/* visually hidden with breakpoints */
@media (max-width: 34.365em) {
.u-hidden-visually\@mobile {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 46.24em) {
.u-hidden-visually\@tablet {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 52.49em) {
.u-hidden-visually\@medium {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 61.24em) {
.u-hidden-visually\@desktop {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 63.99em) {
.u-hidden-visually\@desktop-medium {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 71.865em) {
.u-hidden-visually\@desktop-wide {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 81.24em) {
.u-hidden-visually\@wide {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 34.375em) {
.u-hidden-visually-from\@mobile {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 46.25em) {
.u-hidden-visually-from\@tablet {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 52.5em) {
.u-hidden-visually-from\@medium {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 61.25em) {
.u-hidden-visually-from\@desktop {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 64em) {
.u-hidden-visually-from\@desktop-medium {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 71.875em) {
.u-hidden-visually-from\@desktop-wide {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 81.25em) {
.u-hidden-visually-from\@wide {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
/* hide visually and from screen readers with breakpoints */
@media (max-width: 34.365em) {
.u-hidden\@mobile {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 46.24em) {
.u-hidden\@tablet {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 52.49em) {
.u-hidden\@medium {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 61.24em) {
.u-hidden\@desktop {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 63.99em) {
.u-hidden\@desktop-medium {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 71.865em) {
.u-hidden\@desktop-wide {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (max-width: 81.24em) {
.u-hidden\@wide {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 34.375em) {
.u-hidden-from\@mobile {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 46.25em) {
.u-hidden-from\@tablet {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 52.5em) {
.u-hidden-from\@medium {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 61.25em) {
.u-hidden-from\@desktop {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 64em) {
.u-hidden-from\@desktop-medium {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 71.875em) {
.u-hidden-from\@desktop-wide {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
@media (min-width: 81.25em) {
.u-hidden-from\@wide {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 1px !important;
}
}
/* ---- CUSTOM NORMALIZE CSS -------------------------------------------
Author: Simon Allin / Fu Tang :: JULY 15
--------------------------------------------------------------------- */
html {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
/* box-sizing: border-box; */
font-size: 62.5%; /* Sets up the Base 10 stuff */
}
/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
body {
margin: 0;
padding: 0;
font: 16px/1.231 "Mada", Arial, sans-serif;
font-weight: 400;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
line-height: 1.231 !important;
}
body input:-webkit-autofill {
-webkit-box-shadow: 0 0 0 1000px white inset !important;
}
*, *:before, *:after {
/*box-sizing: inherit;*/
}
main,
ul li {
display: block;
}
/* ==========================================================================
#REMOVE BORDERS
========================================================================== */
/**
* Utility classes to put atomically remove borders
*
* .u-border-top-none {}
* .u-border-right-none {}
* .u-border-bottom-none {}
* .u-border-left-none {}
*/
.u-border-top-none {
border-top: none !important;
}
.u-border-right-none {
border-right: none !important;
}
.u-border-bottom-none {
border-bottom: none !important;
}
.u-border-left-none {
border-left: none !important;
}
/* ==========================================================================
#FLEX mods
========================================================================== */
/**
* Hide only visually, but have it available for screen readers:
* http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*/
.u-flex {
display: flex;
}
.u-flex-d-c {
flex-direction: column;
}
.u-flex-jc-r {
display: flex;
flex-direction: initial;
justify-content: flex-end;
}
.u-flex-jc-l {
display: flex;
flex-direction: initial;
justify-content: flex-start;
}
.u-flex-jc-c {
display: flex;
justify-content: center;
}
.u-flex-foot-div {
margin-top: auto;
}
.u-flex-a-i-c {
display: flex;
align-items: center;
}
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}
body {
margin: 0;
padding: 0;
font: 16px/1.231 "Mada", Arial, sans-serif;
font-weight: 500;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
line-height: 1.231;
height: 100%;
}
body input:-webkit-autofill {
-webkit-box-shadow: 0 0 0 1000px white inset !important;
}
a {
cursor: pointer;
color: #0088CA;
text-decoration: none;
-webkit-transition: 0.2s;
-moz-transition: 0.2s;
transition: 0.2s;
}
a:hover {
text-decoration: underline;
}
.newsroom_whitey {
padding-top: 20px;
}
#about .page_center {
margin: 0 5%;
}
#about h1 {
margin-bottom: 0;
}
p.send_release, p.receive_release {
padding-bottom: 16px;
}
.more_info:hover {
text-decoration: underline;
}
/* ==========================================================================
RELEASE PAGE
========================================================================== */
.release_article a {
text-decoration: none;
}
.release_article article header h1 {
margin: 0 0 0 0;
padding: 20px 0 20px;
}
.addthis_toolbox {
display: block;
width: auto;
clear: both;
padding-top: 20px;
min-width: 205px;
}
.release_body {
clear: both;
padding: 35px 0;
}
.body_extra h3 {
margin: 0 0 0 0;
padding: 0 0 0 0;
}
.body_extra .soundbite {
margin: 4px 0 0 0;
padding: 30px 0;
font-family: "Mada", Arial, sans-serif;
font-size: 21px;
font-size: 2.1rem;
font-weight: 300;
background: transparent url(img/icons/open_quote_lg.png) no-repeat scroll 0 0;
}
@media (min-width: 768px) {
.body_extra .soundbite {
padding-bottom: 0;
}
}
.foot_note {
padding: 20px 0;
border-top: 1px dotted #ccc;
}
.pipe {
float: left;
height: 18px;
margin-top: 4px;
padding: 0 10px;
color: #ccc;
}
.company_rss {
padding: 0 0 23px 0;
margin-top: 10px;
}
#SW h2.home_title.left {
font-size: 195%;
margin-bottom: 10px;
}
.rel_time time {
float: left;
margin: 0 8px 0 0;
padding: 8px 6px 8px 0;
color: #666;
}
/* =====================================
SIDE BAR
===================================== */
.release_display_side h2 {
margin: 0 0 20px 0;
padding: 16px 0 12px;
font-size: 200%;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 300;
color: #666;
border-bottom: 1px solid #ccc;
}
aside .side_info li {
margin-bottom: 12px;
}
.aside_box {
padding-bottom: 30px;
}
.aside_link {
text-decoration: none;
margin-top: 6px;
display: block;
}
/* =====================================
NEWSROOMS
===================================== */
img.newsroom_logo {
max-width: 100%;
padding: 12px 0;
}
.newsroom_follow {
padding: 16px 0;
}
.newsroom_about {
font-family: "Mada", Arial, sans-serif;
font-size: 17px;
font-size: 1.7rem;
font-weight: 400;
}
/* =====================================
ATTATCHMENTS
===================================== */
img.release_img {
max-width: 100%;
margin-bottom: 8px;
}
.release_attatchments li {
margin-bottom: 16px;
}
.release_attatchments img {
max-width: 80%;
}
@media only screen and (min-width: 480px) {
/* ==========================================================================
1 THIRD up
========================================================================== */
}
@media only screen and (min-width: 768px) {
/* ==========================================================================
2 THIRDS up
========================================================================== */
.addthis_toolbox {
float: right;
width: auto;
clear: none;
padding-top: 0;
min-width: 205px;
}
.release_display_main {
float: left;
width: webkit-calc(72% - 48px );
width: -moz-calc(72% - 48px );
width: calc(72% - 48px );
margin-right: 48px;
}
.release_display_side {
float: right;
width: 28%;
line-height: 1.4;
}
.release_article article header h1 {
font-family: "Mada", Arial, sans-serif;
font-size: 50px;
font-size: 5rem;
font-weight: 700;
margin-bottom: 30px;
}
.rel_time {
float: left;
width: auto;
}
#SW h1.heading.center {
display: inline-block;
}
#about .page_center {
margin-left: auto;
margin-right: auto;
}
.body_extra {
float: right;
width: 40%;
padding-bottom: 10px;
margin-left: 13px;
}
}
@media only screen and (min-width: 1140px) {
/* ==========================================================================
FULL WIDTH
========================================================================== */
#SW h2.home_title.left {
float: left;
}
}
/* ==========================================================================
GENERIC STYLES
========================================================================== */
a {
color: #006699;
}
p {
line-height: 1.8em;
}
.wrapper.margin_top {
margin-top: 40px;
}
/*.list_reset { list-style-type: none; padding:0 0 0 0; margin:0 0 0 0; }*/
/*.inline li { display: inline; }*/
.step_pad {
padding: 0 10%;
}
.page_centre {
margin: 0 auto;
}
/*.center { text-align: center; }*/ /*this has is also included in mliu_core*/
.center_align {
margin-left: auto !important;
margin-right: auto !important;
}
h1.no_padding {
padding: 0 0 0 0;
}
h1.no_margin {
margin: 0 0 0 0;
}
h1.heading {
font-family: "Mada", Arial, sans-serif;
font-size: 28px;
font-size: 2.8rem;
font-weight: 500;
margin: 28px 0;
color: #666;
}
h1.plain.medium {
font-size: 160%;
}
h1.heading.center {
display: none;
width: auto;
text-align: center;
}
h1.heading.outline {
border-bottom: 3px solid #CFCFCF;
padding-bottom: 6px;
}
h1.heading.underline {
border-bottom: 2px solid #CFCFCF;
}
h2.pricing_header span {
color: #83AC44;
font-weight: bold;
}
.pa_logo {
display: block;
width: 100px;
height: 100px;
margin-top: 8px;
background: transparent url(img/promo/pa_logo_100x100_2015.png) no-repeat;
}
#SW div.release_list {
padding: 0 0 60px;
}
/* ==========================================================================
INDEX STYLES
========================================================================== */
.newsroom_examples {
clear: both;
}
.newsroom_examples li {
float: left;
width: 33%;
text-align: center;
}
.newsroom_examples li a {
display: block;
}
.newsroom_examples li img {
max-width: 80%;
display: inline-block;
margin: 0 auto;
}
.promo {
border-top: 1px solid #ccc;
}
.promo.light_grey {
background: #f7f7f7;
}
.promo.mid_grey {
background: #ccc;
}
.promo.grey {
background: #575859;
}
.promo.green {
background: #61A233;
}
.promo.magenta {
background: #ff0066;
}
.promo.orange {
background: #FBB611;
}
.promo.blue {
background: #13A1E1;
}
.promo.light_blue {
background: #C0DDEA;
}
.press_association_logo {
margin: 10px 20px 20px 0;
float: left;
padding-right: 20px;
border-right: 1px solid #B02025;
}
.dual_box {
float: left;
width: 45.7%;
}
.dual_box.left {
padding-right: 4%;
border-right: 3px dotted #ccc;
}
.dual_box.right {
padding-left: 4%;
}
.sub_info {
padding: 30px 0 10px;
}
h3.persuasive {
display: inline-block;
width: auto;
margin: 16px auto;
border: solid 1px #E8E8E8;
border-radius: 6px;
margin: 30px 0;
padding: 10px;
background: #FFF;
font-size: 167%;
font-weight: normal;
box-shadow: 3px 3px rgba(0, 1, 2, 0.1);
}
h3.persuasive span {
color: #F8B213;
font-weight: bold;
text-decoration: underline;
}
.persuasive.light {
border-color: #B2B2B2;
}
.persuasive.negative {
margin-bottom: -10px;
z-index: 1;
position: relative;
}
/* =====================================
Sub menu for sub about pages
===================================== */
/* =====================================
Prices page
===================================== */
.price.section {
margin-right: 4%;
min-height: 400px;
}
.price.section.right {
margin: 8% 0 0 0;
}
.price h2 {
padding: 5px 0;
margin: 0 0 15px 0;
font-size: 180%;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: normal;
}
.price > span {
padding: 10px 0;
display: block;
color: #666666;
}
.price .benefits {
width: auto;
margin: 0 auto;
padding: 20px 3%;
background-color: #f7f7f7;
border: solid 2px #e7e7e7;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
@media (min-width: 61.25em) {
.price .benefits {
width: 80%;
}
}
.price .benefits li {
font-size: 16px;
font-size: 1.6rem;
background: url(/img/about/price_tick.gif) no-repeat 8px 10px;
color: #666;
padding: 12px 8px 12px 50px;
margin-bottom: 2px;
text-align: left;
}
.price .benefits li.title {
background-image: none;
padding-left: 8px;
font-weight: bold;
}
.packages {
border: 3px solid #cccccc;
margin-bottom: 45px;
}
.packages.center {
text-align: center;
}
.packages > li {
padding: 15px 20px;
}
.packages > li:nth-child(2) {
border: 2px solid #e7e7e7;
border-right: none;
border-left: none;
background-color: #f7f7f7;
}
/* pricing extras */
.extras {
border: 1px solid #cccccc;
border-right: none;
border-left: none;
}
.extras > li {
padding: 7px 0;
position: relative;
}
.extras > li:first-child {
margin-top: 10px;
}
.extras > li:last-child {
margin-bottom: 15px;
}
/* general settign */
.desc, .cost {
line-height: 1.2;
}
@media (min-width: 61.25em) {
.desc, .cost {
display: inline-block;
vertical-align: middle;
}
}
.desc {
font-family: "Mada", Arial, sans-serif;
font-size: 26px;
font-size: 2.6rem;
font-weight: 400;
}
@media (min-width: 61.25em) {
.desc {
text-align: left;
width: webkit-calc(100% - 154px);
width: -moz-calc(100% - 154px);
width: calc(100% - 154px);
}
}
.cost {
font-family: "Mada", Arial, sans-serif;
font-size: 50px;
font-size: 5rem;
letter-spacing: -0.5px;
font-weight: 300;
margin: 0 0 0 0;
}
@media (min-width: 61.25em) {
.cost {
width: 150px;
text-align: right;
}
}
.cost > small {
display: block;
font-size: 20px;
font-size: 2rem;
font-weight: 400;
}
.extras .desc {
font-family: "Mada", Arial, sans-serif;
font-size: 22px;
font-size: 2.2rem;
font-weight: 400;
}
@media (min-width: 61.25em) {
.extras .desc {
width: webkit-calc(100% - 104px);
width: -moz-calc(100% - 104px);
width: calc(100% - 104px);
}
}
.extras .cost {
font-size: 30px;
font-size: 3rem;
}
@media (min-width: 61.25em) {
.extras .cost {
width: 100px;
}
}
.desc span {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
padding-top: 2px;
color: #60A133;
display: block;
}
.desc span b {
text-decoration: underline;
}
.cost small {
letter-spacing: normal;
}
.cost em {
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 500;
font-style: normal;
}
.cost span {
letter-spacing: -5px;
}
@media only screen and (min-width: 768px) {
/* ==========================================================================
2 THIRDS up
========================================================================== */
.price.section {
width: 48%;
float: left;
margin-right: 4%;
min-height: 400px;
}
.price.section.right {
margin: 0 0 0 0;
}
}
/* =====================================
Reviews / Case studies
===================================== */
.featured {
padding-top: 50px;
}
.case_study.feature {
float: left;
width: 32.5%;
min-height: 200px;
margin: 0 1% 0 0;
}
.case_study.feature.single {
float: none;
display: block;
margin-left: auto;
margin-right: auto;
}
.case_study span {
position: relative;
}
.case_study.feature img {
width: 100%;
height: auto;
}
.case_study.feature h3, .case_study.featurecenter h3 {
font-family: "Mada", Arial, sans-serif;
font-size: 27px;
font-size: 2.7rem;
color: #333;
margin: 0 0 0 0;
padding: 10px 8px 10px 8px;
}
.case_study.feature.last {
margin-right: 0;
}
.case_study.feature h3 small {
color: #8B8989;
}
.case_study.feature.double {
background-color: #DFDFDF;
width: 85%;
float: none;
vertical-align: top;
margin: 0 auto;
}
.case_study.feature.double.last {
margin-top: 20px;
}
.quotes {
margin-top: 50px;
}
.quotes .quote {
width: 100%;
display: block;
margin: 0 auto 0;
padding: 20px 0;
border-bottom: 2px solid #E7E7E7;
font-size: 120%;
}
.quotes .quote.clear_line {
border-bottom: none;
}
.quotes .quote blockquote {
margin: 0 0;
}
.quotes .quote p.author {
margin-bottom: 0;
}
.review {
margin-top: 40px;
}
#SW .review h3 {
margin-top: 0;
font-family: "Mada", Arial, sans-serif;
font-size: 30px;
font-size: 3rem;
font-weight: 300;
color: #333;
}
.review h2.divorce_online {
width: 100%;
height: 65px;
margin-top: 0;
background: transparent url(/img/about/case_study/divorce_online_logo.png) no-repeat;
background-size: 100%;
}
.review h2.famous_publicity {
height: 147px;
margin-top: 0;
background: transparent url(/img/about/case_study/mot_online_logo.jpg) no-repeat;
}
.study.company_info img {
width: 100%;
margin: 0 0 0 0;
}
.study.company_info .info {
padding: 12px 4%;
background-color: #E7E7E7;
}
/*csimg used for about/reviews/case-studies*/
#about a {
text-decoration: none;
}
#about .faq.list li a:hover, #about p a:hover, #about h3 a:hover {
text-decoration: underline;
}
.csimg_inset.left {
float: left;
margin-right: 15px;
}
.csimg_inset {
margin: 8px 0px 15px 0px;
border: 1px solid #ccc;
}
.faq.list {
margin-bottom: 40px;
}
@media only screen and (min-width: 480px) {
/* ==========================================================================
1 THIRD up
========================================================================== */
.case_study.feature.double {
width: 197px;
float: none;
margin: 0 5px 0 5px;
display: inline-block;
display: -moz-inline-stack;
zoom: 1;
*display: inline;
}
.case_study.feature.double.last {
margin-top: 0;
}
.study.company_info {
float: right;
width: 35%;
margin-left: 4%;
margin-bottom: 12px;
}
.review h2.divorce_online {
width: 420px;
height: 90px;
}
}
@media only screen and (min-width: 550px) {
/* ==========================================================================
2 THIRD up
========================================================================== */
.case_study.feature.double {
width: 216px;
margin: 0 10px 0 10px;
}
}
@media only screen and (min-width: 768px) {
/* ==========================================================================
3 THIRDS up
========================================================================== */
.quotes .quote {
width: 70%;
}
.side.right {
width: 75%;
}
}
@media only screen and (min-width: 1140px) {
/* ==========================================================================
FULL WIDTH
========================================================================== */
}
/* =====================================
ABOUT JOURNO specific
===================================== */
/* about box */
#ABOUT_NEWSROOMS {
border: 1px solid #ccc;
border-radius: 6px;
font: 12px arial;
margin: auto;
width: 900px;
}
/* about li */
#ABOUT_NEWSROOMS li {
width: 429px;
padding: 10px;
margin: 0 0 0 0;
float: left;
display: inline;
background: #f9f9f9;
border-bottom: 1px solid #e7e7e7;
}
#ABOUT_NEWSROOMS li.left {
width: 429px;
border-right: 1px solid #e7e7e7;
}
#ABOUT_NEWSROOMS li.last_row {
border-bottom: none;
}
/* white row */
.about-box .white-row {
background: #fff;
border-top: 1px solid #ddd;
}
#ABOUT_NEWSROOMS h3 {
font-size: 173.1%;
margin-top: 10px;
padding-left: 8px;
}
p.newsroom_promo {
float: left;
width: 306px;
height: 100px;
}
p.newsroom_promo_icon {
float: left;
width: 106px;
height: 100px;
margin: 0 6px;
background: url(/img/newsrooms/newsrooms_sprite.png) no-repeat left 4px;
}
p.newsroom_promo_icon.publish {
background-position: left -96px;
}
p.newsroom_promo_icon.social {
background-position: left -196px;
}
p.newsroom_promo_icon.tracking {
background-position: left -296px;
}
p.newsroom_promo_icon.customise {
background-position: left -396px;
}
p.newsroom_promo_icon.about {
background-position: left -496px;
}
.newsroom_promo_action {
text-align: center;
margin: 30px 0;
}
.action {
padding: 0 0 44px;
text-align: center;
}
.action h3 {
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 300;
font-size: 32px;
font-size: 3.2rem;
margin-top: 0;
}
.action p {
margin-top: 30px;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 300;
font-size: 20px;
font-size: 2rem;
}
.opacity_mask {
display: none;
width: 100px;
height: 100px;
}
/* ===================================== */
/* ! Styles for dashboard (main section) */
/* ===================================== */
#whats_new.dashboard .bloc_wrap .panel {
padding: 0;
margin-bottom: 20px;
}
.blog {
margin-bottom: 20px;
}
i.icon {
background: url(../css_core/icons/info_tool_sprite_14px.png) no-repeat 0 -28px;
cursor: pointer;
float: left;
height: 14px;
margin-left: 10px;
position: absolute;
width: 14px;
}
i.icon:hover {
background: url(../css_core/icons/info_tool_sprite_14px.png) no-repeat;
}
.pricing_footer_notes {
background: #f9f9f9;
border: 1px solid #ddd;
margin: auto;
padding: 20px;
padding-bottom: 8px;
text-align: center;
width: 75%;
}
.pricing_footer_notes p {
font: 93% arial;
}
#release_info li {
word-wrap: break-word;
}
/* ============================== */
/* Lightbox enquiry styles */
/* ============================== */
div h3.persuasive + .mliu_box {
margin-top: 0;
}
/*Trying to restore topic tags*/
ul.release_filter {
margin: 0 0 10px 0;
padding: 0 14px 14px 14px;
clear: both;
display: table;
}
ul.release_filter li {
float: left;
display: inline;
width: auto;
height: auto;
margin: 0 4px 4px 0;
padding: 4px;
position: relative;
color: #444;
font-size: 93%;
white-space: nowrap;
}
.release_panel ul {
display: block;
position: relative;
padding: 0 0 10px 0;
background: #fff;
height: auto;
}
.release_filter.topics li {
background: #82C0FF;
}
.release_filter.topics li a {
color: #000;
text-decoration: none;
}
.release_filter.topics li a:hover {
text-decoration: underline;
}
.tran_background {
background: transparent;
}
.topics_container {
margin: 0 14px 14px 14px;
background: #fff;
}
.topics_container h3 {
padding: 20px 14px 0 14px;
font-size: 160%;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 300;
}
/* force all sidebar images to conform */
#latest_images img {
max-width: 206px !important;
max-height: 300px !important;
}
img.sidebar-max-width {
max-width: 206px;
max-height: 300px;
}
/* ===============================*/
/* ! Styles changes for Newsroom */
/* TEMPORARY CSS that needs to be */
/* checked on gen_master */
/* ===============================*/
.release_filter.topics li {
background: #82C0FF;
}
.topics_container {
margin: 0 14px 14px 14px;
background: #fff;
}
.topics_container h3 {
padding: 20px 14px 0 14px;
font-size: 160%;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: 300;
}
.tran_background {
background: transparent;
}
#wrapper #page_title h1.center {
padding: 0 20%;
}
#contacts_tab_no_access.mliu_box.highlight p:first-child {
margin-top: 0;
}
/* ====================================*/
/* ! Styles changes for release stats */
/* ====================================*/
.print_wrapper {
width: 750px;
margin: 0 auto;
}
.no_marg_top {
margin-top: 0;
}
#MAIN_PAGE.no_pad {
padding: 0;
}
#premium h1 span {
color: #cccccc;
}
#premium p, #premium table tr td, #premium .highlight {
font-size: 93%;
line-height: 1.8em;
vertical-align: top;
margin-bottom: 0;
}
#premium .form_area legend {
top: -42px;
}
#premium table {
width: 100%;
}
#premium table tr td {
min-width: 240px;
}
/*mliu not being inherited as file is not included*/
.mliu_table.enquiries th {
background: none repeat scroll 0 0 #333333;
border-bottom: medium none;
border-right: 1px solid #5D5D5D;
color: #FFF;
}
.mliu_table.enquiries td {
padding: 10px;
border-right: 1px solid #EEEEEE;
border-bottom: 1px solid #EEEEEE;
color: #666;
}
.highlight.warning {
border: 1px solid #F0E68C;
background: #FFFFE0;
} /*PLACE HOLDER WARNING - NEEDS REVISITING*/
.mliu_table .right {
text-align: right;
float: none;
} /* ultra specific styling secton | dont overuse */
/*title area with utilities*/
.stat_title {
position: relative;
}
.stat_title h1 {
width: 75%;
float: left;
padding: 0;
margin: 0;
}
.pstat_tools {
position: absolute;
bottom: 0;
right: 0;
}
.print_metric {
display: inline-block;
height: 47px;
width: 56px;
background: transparent url(/img/tools.png) no-repeat left top;
text-indent: -9999px;
/* for ie7 */
*text-indent: 0;
*font-size: 0;
*line-height: 0;
}
.download_metric {
display: inline-block;
height: 47px;
width: 56px;
background: transparent url(/img/tools.png) no-repeat right top;
text-indent: -9999px;
/* for ie7 */
*text-indent: 0;
*font-size: 0;
*line-height: 0;
}
.print_metric:hover {
background: transparent url(/img/tools.png) no-repeat left bottom;
}
.download_metric:hover {
background: transparent url(/img/tools.png) no-repeat right bottom;
}
/*MERGRE CONFLICT / DOUBLE CHECK LATER*/
#wrapper #page_title h1.center {
padding: 0 20%;
}
#contacts_tab_no_access.mliu_box.highlight p:first-child {
margin-top: 0;
}
/* =====================================
SW NEWSROOMS ADMIN
===================================== */
.newsrooms_admin {
font-family: "Mada", Arial, sans-serif;
font-size: 15px;
font-size: 1.5rem;
}
#newsroom_admin {
margin-bottom: 40px;
}
#admin_content {
border: 1px solid #999999;
padding: 20px;
margin-top: 1px;
}
#admin_content h3 {
font-family: "Mada", Arial, sans-serif;
font-size: 25px;
font-size: 2.5rem;
font-weight: 400;
}
#admin_content .header h3 {
float: left;
width: auto;
}
#admin_content h4.social_link {
width: 100px;
font-size: 26px;
font-size: 2.6rem;
line-height: 1.1;
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: normal;
margin-top: 0px;
margin-bottom: 0;
}
#SW #admin_content .label {
float: left;
width: 30%;
}
#admin_content .data {
float: right;
width: 70%;
}
#tab_li_container li.selected {
border-color: #999999;
height: 44px;
background: #FFF;
}
#tab_li_container li.selected a {
color: #333;
}
#change_newsroom {
float: left;
width: auto;
margin-top: 4px;
}
#subscription_package {
float: left;
width: auto;
margin-left: 10px;
border-left: 1px solid #ccc;
padding-left: 8px;
margin-top: 4px;
margin-right: 8px;
}
.no_alias #subscription_package {
padding-left: 0;
border-left: none;
margin-left: 0;
}
#SW #admin_sub_info {
margin-bottom: 18px;
border: 1px solid #e7e7e7;
border-radius: 8px;
padding: 8px;
width: auto;
background: #f7f7f7;
}
#SW #admin_sub_info.no_alias {
float: right;
}
#SW #admin_sub_info label {
width: 150px;
padding: 5px 0;
font-size: 123%;
}
#SW #admin_sub_info select {
width: 250px;
font-size: 123%;
padding: 5px;
}
#info_tab ul {
padding: 14px;
border: 1px solid #ccc;
border-radius: 8px;
}
#info_tab ul li {
margin-bottom: 12px;
}
#tab_li_container.newsrooms_admin li {
padding-left: 7px;
margin-right: 4px;
}
#tab_li_container li.last_menu_item {
margin-right: 0;
}
/* =====================================
SOCIAL MEDIA tab
===================================== */
.content.social_admin {
clear: both;
padding-top: 1px;
margin-top: 0;
}
.social_link {
display: block;
width: auto;
height: 40px;
background: url(../newsrooms/images/social_sharing_sprite.png) no-repeat left top;
padding: 8px 0 0 44px;
color: #333;
}
.social_link.youtube {
background-position: left -140px;
}
.social_link.facebook {
background-position: left -280px;
}
.social_link.linkedin {
background-position: left -420px;
}
.social_link:hover {
text-decoration: none;
color: #333;
}
#admin_content h3.social_link {
margin: 6px 0 10px 0;
}
#admin_content .pub_info_box {
clear: both;
}
p.youtube_input {
float: left;
margin: 0 10px 0 0;
}
/* =====================================
LINKS tab
===================================== */
#links_tab h3 {
float: left;
width: auto;
}
#links_tab ul {
padding: 14px;
border: 1px solid #ccc;
border-radius: 8px;
clear: both;
}
#links_tab ul li {
margin-bottom: 10px;
}
#links_tab ul li a {
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: normal;
font-size: 153.9%;
}
#links_tab a.tools {
float: left;
display: inline;
margin-top: 22px;
}
.admin-header-help {
clear: both;
}
/* =====================================
CONTACTS tab
===================================== */
#contacts_tab a.contact_avatar {
float: left;
margin-right: 6px;
}
#contacts_tab ul h4 {
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: normal;
font-size: 23px;
font-size: 2.3rem;
margin: 28px 0 0 0;
float: left;
width: 250px;
}
#contacts_tab ul li a.tools {
float: right;
display: inline;
}
#contacts_tab ul {
width: 464px;
float: left;
padding: 8px;
border: 1px solid #ccc;
border-radius: 8px;
margin: 0 20px 20px 0;
}
#contacts_tab ul li {
margin-bottom: 6px;
}
#contacts_tab ul li .label {
float: left;
width: 30%;
}
#contacts_tab ul li .data {
float: right;
width: 70%;
}
span.NA {
color: #ccc;
}
/* =====================================
THEMES tab
===================================== */
.theme-options label, .theme-options input[type=text], .theme-options select {
font-size: 13px;
font-size: 1.3rem;
font-family: "Mada", Arial, sans-serif;
}
#theme_tab ul li {
margin-bottom: 10px;
}
#theme_tab ul li input {
border-width: 1px;
float: left;
}
#theme_tab ul li .label {
width: 50%;
}
#theme_tab ul li .input {
float: right;
width: 50%;
height: 33px;
}
#theme_tab fieldset {
margin: 0 0 10px 0;
}
fieldset#design_options {
border: 3px solid #E7e7e7;
background-color: #f1f1f1;
padding: 8px;
}
fieldset#design_options h4 {
margin-top: 0;
}
#advance_theme {
margin: 50px 0 0;
padding: 0;
}
#advance_theme h4 {
margin: 0 0 20px;
}
#advance_theme label {
font-size: 16px !important;
width: auto !important;
}
#advance_theme input[type=checkbox] {
margin: 3px 10px;
padding: 0;
float: none;
}
#advance_theme .divider {
border-bottom: 1px solid #E7E7E7;
padding: 15px 0 10px;
}
#advance_theme #embed-site-instructions {
font-family: "Mada", Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
}
#advance_theme .instructions {
padding: 8px;
border: 1px solid #ccc;
border-radius: 8px;
margin: 5px 0 20px;
padding: 5px;
padding: 15px 15px 0;
background-color: #F7F7F7;
}
#advance_theme .instructions ol {
background-color: #F7F7F7;
}
#advance_theme .boxed {
border: 1px solid #ccc;
padding: 0 10px;
margin: 10px 0;
background-color: #F7F7F7;
}
#advance_theme .boxed pre {
margin: 0;
}
#advance_theme #codeArea {
margin-bottom: 20px;
}
#advance_theme.entry {
border: 1px dotted #CCCCCC;
}
#advance_theme h3 {
margin: 0;
}
#advance_theme textarea {
width: 98.5%;
}
#advance_theme .entry_header {
padding: 15px;
background: transparent url(../css_core/icons/activity_expander_sprite_grey.gif) no-repeat right 5px;
min-height: 29px;
}
#advance_theme .entry_header:hover {
background-position: right -45px;
cursor: hand;
cursor: pointer;
}
#advance_theme .entry_header.minus {
background-position: right -95px;
cursor: hand;
cursor: pointer;
}
#advance_theme .entry_header.minus:hover {
background-position: right -145px;
cursor: hand;
cursor: pointer;
}
#advance_theme .mini_form .entry_header {
background-position: right 3px;
}
#advance_theme .mini_form .entry_header:hover {
background-position: right -47px;
cursor: hand;
cursor: pointer;
}
#advance_theme .mini_form .entry_header.minus {
background-position: right -97px;
cursor: hand;
cursor: pointer;
}
#advance_theme .mini_form .entry_header.minus:hover {
background-position: right -147px;
cursor: hand;
cursor: pointer;
}
.entry_content {
padding: 8px 15px 20px 15px;
}
/* =====================================
UPLOAD tab
===================================== */
#upload_tab hr {
margin: 25px 0 0 0;
}
.upload.logo {
margin: 0 0 0 0;
padding: 0 0 0 0;
}
.media {
clear: both;
padding-top: 20px;
}
#media_form_tab .media {
padding: 0;
}
#upload_tab .media.logo {
display: inline-block;
margin-left: 5%;
padding: 0 0 0 5%;
border-left: 1px solid #eaeaea;
text-align: center;
}
#upload_tab .thumb_list li {
float: left;
padding: 15px;
border: 1px solid #eaeaea;
min-height: 90px;
width: 150px;
text-align: center;
}
#upload_tab .thumb_list li img {
height: 45px;
max-width: 140px;
}
#upload_tab .thumb_list li .caption_util {
border-top: 1px solid #eaeaea;
margin-top: 15px;
padding-top: 10px;
}
#logo_tab ul li, #media_form_tab ul li {
margin-bottom: 10px;
}
#logo_tab ul li input, #media_form_tab ul li input {
border-width: 1px;
}
#logo_tab ul li .label, #media_form_tab ul li .label {
padding-top: 7px;
}
#logo_tab ul li .input, #media_form_tab ul li .input {
float: left;
}
/* =====================================
CONTACT/COMPANY edit
===================================== */
#contact_edit ul li {
margin-bottom: 10px;
}
#contact_edit ul li input {
border-width: 1px;
}
#contact_edit ul li label {
width: 30%;
padding-top: 7px;
}
#contact_edit ul li .input {
float: right;
width: 70%;
}
#company_edit ul li {
margin-bottom: 10px;
}
#company_edit ul li input {
border-width: 1px;
}
#company_edit ul li label {
width: 40%;
padding-top: 7px;
}
#company_edit ul li .input {
float: right;
width: 60%;
}
#address_edit ul li {
margin-bottom: 10px;
}
#address_edit ul li input {
border-width: 1px;
}
#SW #wrapper #address_edit label {
width: 30%;
}
#SW #wrapper #address_edit label.error {
width: 30%;
}
#address_edit ul li label {
width: 20%;
padding-top: 7px;
}
#address_edit ul li .input {
float: right;
width: 70%;
}
/* =====================================
RELEASES tab
===================================== */
ul.admin_releases {
padding: 8px;
border: 1px solid #ccc;
border-radius: 8px;
margin: 0 0 20px 0;
}
ul.admin_releases li {
border-bottom: 1px solid #e7e7e7;
padding: 0 0 0 0;
}
ul.admin_releases li:hover {
background-color: #F5F5F5;
-webkit-transition: background-color 0.5s ease-in;
-moz-transition: background-color 0.5s ease-in;
-o-transition: background-color 0.5s ease-in;
transition: background-color 0.5s ease-in;
}
ul.admin_releases li a {
float: left;
font-size: 16px;
font-size: 1.6rem;
width: 882px; /*874px;*/
padding: 10px 0;
}
ul.admin_releases li a:hover {
background-position: right -25px;
}
ul.admin_releases li span.release_date {
float: left;
width: 106px;
color: #999;
margin-right: 8px;
}
/* releases list tool icons */
ul.admin_releases li a.link_icon {
float: left;
width: 34px;
height: 34px;
padding: 0 0 0 0;
margin: 6px 0 6px 8px;
background: url(../newsrooms/images/admin_release_stats_sprite.png) no-repeat scroll left top transparent;
}
ul.admin_releases li a.link_icon.stats {
background-position: left top;
}
ul.admin_releases li a.link_icon.stats:hover {
background-position: left -34px;
}
ul.admin_releases li a.link_icon.stats.premium {
background-position: left -68px;
}
ul.admin_releases li a.link_icon.stats.premium:hover {
background-position: left -102px;
}
ul.admin_releases li a.link_icon.stats.locked {
background-position: left -136px;
}
/* =====================================
PAGINATION
===================================== */
.pagination {
padding: 8px;
border: 1px solid #ccc;
border-radius: 8px;
margin: 0 0 20px 0;
}
.pagination li {
border: 1px solid #CCCCCC;
display: inline;
float: left;
margin: 0 3px 0 0;
padding: 0;
text-align: center;
border-bottom: 1px solid #CCCCCC;
}
.pagination li.current_page {
width: 38px;
height: 38px;
padding: 8px;
border: 2px solid #666666;
color: #333;
}
.pagination li#pagination_pages {
padding: 8px;
border-bottom: none;
}
.pagination a {
float: left;
display: inline;
width: 36px;
height: 36px;
padding: 8px;
background: none;
color: #333;
text-decoration: none;
}
.pagination a:hover {
text-decoration: underline;
}
.pagination a.pagination_nav {
background-color: #F1EFEB;
}
#SW .pagination.days li,
#SW .pagination.months li,
#SW .pagination.years li {
margin: 10px;
}
#SW .pagination.days a,
#SW .pagination.months a,
#SW .pagination.years a {
width: auto;
}
/* for small pages number */
#pagination_pages {
font-size: 85%;
color: #333;
border: none;
position: relative;
padding: 9px;
}
span.paginate_button, span.paginate_active {
float: left;
display: inline;
width: auto;
height: 16px;
padding: 8px 12px;
background: none;
color: #333;
border: 1px solid #CCCCCC;
margin-right: 3px;
cursor: pointer;
}
.previous.paginate_button,
.next.paginate_button,
.first.paginate_button,
.last.paginate_button {
width: auto;
background-color: #F1EFEB;
}
span.paginate_active {
border: 2px solid #666;
}
.no-js .admin_bloc {
border-bottom: 1px solid #999;
padding-bottom: 20px;
}
.social_admin_bloc {
width: 436px;
float: left;
padding: 8px;
border: 1px solid #ccc;
border-radius: 8px;
margin: 0 20px 20px 0;
}
.social_admin_bloc:nth-child(4) {
clear: left;
}
form#newsroom_edit {
padding-bottom: 5px;
}
form#newsroom_edit ul {
margin-bottom: 10px;
}
form#newsroom_edit li {
margin-bottom: 8px;
}
form#newsroom_edit label {
float: left;
display: inline;
padding: 6px;
width: 100px;
}
form#newsroom_edit input {
padding: 6px;
}
/* =====================================
STATS tab
===================================== */
#free_stats_container {
padding-bottom: 15px;
}
#free_stats_container #page_title {
padding: 0;
}
#free_stats_container li {
display: block;
padding-left: 0;
}
#free_stats_container .label, #free_stats_container .stat_result {
float: left;
display: inline;
padding: 6px 6px 6px 0;
width: 230px;
font-size: 123.1%;
color: #000;
}
#free_stats_container .stat_result {
font-weight: bold;
color: #000;
width: auto;
}
#free_stats_container p.approx {
margin-top: 8px;
}
#free_stats_container p.more_stats {
margin-top: 25px;
}
/*setting width for the free stats litebox*/
.free-stat.white-popup {
max-width: 320px;
}
.free-stat.white-popup p {
font-size: 90%;
}
.no-avatar {
background: url(/img/avatar.gif) no-repeat top;
border: 1px dashed #ddd;
border-radius: 100px;
height: 70px;
}
.feed_switch {
background: #f1f1f1;
border: 1px solid #ccc;
border-radius: 3px;
margin-bottom: 5px;
padding: 8px;
height: 40px;
}
.feed_switch .fb_btn {
border-radius: 0;
cursor: pointer;
float: left;
margin-left: 10px;
padding: 5px;
}
.feed_switch .fb_btn:active {
box-shadow: inset 2px 2px 2px #000;
}
.feed_switch select#fb_selection {
border: 1px solid #ccc;
border-radius: 3px;
float: left;
font: 12px arial;
margin-left: 10px;
width: 200px;
margin-top: 10px;
}
/* =====================================
USERS tab
===================================== */
#newsroom_user_admin {
padding: 8px;
border: solid 1px #ccc;
border-radius: 8px;
}
#newsroom_user_admin > form {
font-size: 13px;
font-size: 1.3rem;
}
#users_tab form {
margin: 0 0 8px 0;
border-bottom: 1px solid #e7e7e7;
}
#users_tab ul.newsroom_admin.heading li {
margin-bottom: 16px;
padding: 6px 0 10px;
border-bottom: 1px solid #e7e7e7;
}
#users_tab ul.newsroom_admin li {
float: left;
display: inline;
padding: 0 0 8px 0;
}
ul.newsroom_admin li.USER {
width: 25%;
}
ul.newsroom_admin li.EMAIL {
width: 40%;
}
ul.newsroom_admin li.ADMIN {
width: 10%;
}
ul.newsroom_admin li.TOOLS {
width: 25%;
}
#wrapper #newsroom_user_admin input {
font-size: 100%;
}
.admin_upgrade {
background: #e7e7e7 url(../css_core/icons/padlock_large.png) no-repeat center center;
height: 140px;
opacity: 0.6;
filter: alpha(opacity=60);
overflow: hidden;
padding-top: 100px;
text-align: center;
width: 100%;
z-index: 10;
}
.admin_upgrade.authorize {
padding-top: 50px;
height: 190px;
}
.admin_upgrade p {
color: #333;
font-size: 22px;
}
.admin_subscription_info {
text-align: right;
margin: 0 0 0 0;
padding: 5px 0;
font-size: 123.1%;
}
.admin_subscription_info a, a.request {
font-size: 93%;
}
/* =====================================
GENERICS
===================================== */
.css_success {
clear: both;
background: #fff url(../css_core/icons/success_tick.gif) no-repeat 10px center;
}
.css_success h4 {
color: #62A442;
padding: 10px 10px 10px 70px;
margin: 0 0 14px 0;
font-size: 138.58%;
font-weight: lighter;
}
.css_fail {
clear: both;
background: #fff url(../css_core/icons/fail_x.gif) no-repeat 10px center;
}
.css_fail h4 {
color: #ff0033;
padding: 10px 10px 10px 70px;
margin: 0 0 14px 0;
font-size: 138.58%;
font-weight: lighter;
}
.oops_bubble {
border: 1px solid #CCC;
border-radius: 8px;
background: #F7F7F7;
padding: 8px;
}
ul#error_links li {
float: left;
}
/* =====================================
POSTS tab
===================================== */
.textbox .text_class,
.text_class_type {
color: #aaa;
display: block;
font: 12px;
height: 100px;
margin-bottom: 0;
width: 100%;
padding: 8px;
}
#advance_theme_edit .textbox .text_class_type {
height: 300px;
}
.post_options {
border-bottom: 2px solid #ddd;
display: none;
padding-bottom: 10px;
padding-top: 10px;
}
/* div containing the status of the message being posted */
.post_status {
background: #dff0d8;
border: 1px solid #d6e9c6;
color: #468847;
display: none;
font: 11px;
margin-top: 10px;
margin-bottom: 10px;
padding: 5px;
}
/* div that counts the number of characters */
.post_options .character_count {
background: #000;
border: 1px solid #333;
color: #fff;
display: none;
padding: 3px;
}
/* The options (twitter and facebook) */
.post_options .media_options {
background: url(../newsrooms/images/social_sharing_sprite.png) no-repeat;
float: left;
padding: 10px;
padding-left: 50px;
margin-bottom: 0;
}
.post_options .media_options.facebook_check {
background-position: 0 -280px;
}
/* The share button */
button.share_btn {
color: #fff;
float: right;
font: bold 12px;
}
/* where the posted status' will be placed */
#post_table {
height: 500px;
margin-top: 20px;
overflow: auto;
}
/* post status contained here */
.newsroom_post {
border-bottom: 2px solid #ddd;
margin-bottom: 10px;
padding: 10px;
}
.newsroom_post p {
background: #f7f7f7;
color: #333;
font-size: 14px;
font-size: 1.4rem;
padding: 10px;
line-height: 1.6;
}
.newsroom_post p.newsroom_post_time {
background: #fff;
color: #888;
font: 11px;
padding-left: 12px;
}
.newsroom_post span {
color: #ccc;
font: 11px;
}
.newsroom_post span a.delete_newsroom_post {
color: #c00;
cursor: pointer;
float: right;
font: 11px;
}
.delete_post_tooltip {
background: #a00; /* for non-css3 browsers */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#aa0000", endColorstr="#cc0000"); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#a00), to(#c00)); /* for webkit browsers */
background: -moz-linear-gradient(top, #a00, #c00); /* for firefox 3.6+ */
border: 0;
border-radius: 3px;
color: #fff;
display: none;
font: bold 11px arial;
left: 0;
padding: 5px;
position: fixed;
text-align: center;
top: 0;
width: 330px;
}
/**
* Main style for this Google Analytics block.
*/
/* tooltip style */
#tooltip {
background: #D9EDF7;
border: 1px solid #BCE8F1;
border-radius: 3px;
box-shadow: 0 0 10px #ccc;
color: #3A87AD;
display: none;
font: 12px arial;
left: 0;
padding: 10px;
position: fixed;
top: 0;
text-align: center;
width: 250px;
}
.stats_info {
width: 574px;
background: #F7F7F7;
border: 1px solid #DDD;
padding: 10px;
color: #468847;
}
.stats_info input, .stats_info select {
float: left;
width: 125px;
margin: 4px 8px 4px 0;
}
#date_picker_info {
background: #F9F9F9;
border: 1px solid #DDD;
border-top: 0;
color: #888;
font: 11px arial;
margin-bottom: 20px;
padding: 10px;
text-align: center;
width: 574px;
}
ol#premium_steps {
list-style-position: inside;
list-style-type: decimal;
margin-left: 20px;
}
#analytics_results {
clear: both;
margin-bottom: 48px;
}
#analytics_results table {
border-collapse: collapse;
border: 1px solid #ccc;
margin: auto;
clear: both;
font-size: 14px;
font-size: 1.4rem;
}
#analytics_results th {
border-left: 1px solid #ccc;
padding: 6px;
vertical-align: top;
color: #666;
}
#analytics_results td {
color: #333;
background: #fff;
border-left: 1px solid #ccc;
cursor: pointer;
font-size: 123%;
font-weight: bold;
margin-right: 5px;
padding: 6px;
text-align: center;
width: 125px;
}
.stats-add-analytics {
line-height: 1.6px;
}
/* Ashton - 8/8/12 */
#SW .cmxform .error {
color: #FF0000;
display: block;
padding-top: 6px;
}
.breadcrumb {
display: block;
float: left;
}
.last-breadcrumb {
display: block;
}
#tab_li_container li.last_menu_item {
margin-right: 0;
}
/*** rss feeds ***/
.rss_left {
float: left;
width: 30%;
padding-left: 30px;
}
.rss_left h3 {
font-size: 16px;
padding-bottom: 10px;
}
.rss_right {
float: right;
width: 60%;
padding-right: 30px;
}
.rss_left .line {
margin: 10px 0 20px 0;
}
.rss_left .line, .rss_right .line {
width: 100%;
}
/**
Style for the admin post section
*/
/* =====================================
MAGNIFIC popup style extensions
===================================== */
.white-popup {
color: #333;
}
.white-popup h1 {
margin: 0 0 0 0;
font: 235%/1.1 "Mada", Arial, sans-serif !important;
}
.white-popup .label {
float: left;
}
.white-popup input {
padding: 6px;
}
.white-popup.sw p {
font-size: 14px;
font-weight: normal;
color: #333;
}
.white-popup.sw p b {
font-size: 14px;
font-weight: bold;
}
.white-popup.sw ul {
padding-left: 20px;
}
.white-popup.sw h2 {
padding: 10px 0;
}
h1.small {
padding: 5px;
margin: 5px;
}
/* ==========================================================================
FEEDS
========================================================================== */
.feed_list li {
margin-bottom: 10px;
font-size: 14px;
font-size: 1.4rem;
}
.feed_list li a {
text-decoration: none;
color: #333;
}
.feed_list li a.cat_name {
display: inline-block;
padding-top: 3px;
}
#main_feeds {
text-align: center;
}
.main_feed {
display: inline-block;
margin-bottom: 40px;
width: 200px;
font: 235%/1.1;
padding-top: 130px;
text-decoration: none;
}
.main_feed:hover {
text-decoration: underline;
}
.main_feed.rss {
background: url(img/icons/ico_feeds_rss_120_120.png) no-repeat center top;
}
.main_feed.twitter {
background: url(img/icons/ico_feeds_twitter_148_120.png) no-repeat center top;
}
.cat_feed {
width: 24px;
height: 24px;
float: left;
margin-right: 3px;
}
.cat_feed.twitter {
background: url(img/icons/ico_feeds_twitter_24_24.jpg);
}
.cat_feed.rss {
background: url(img/icons/ico_feeds_rss_24_24.jpg);
}
@media only screen and (min-width: 480px) {
/* ==========================================================================
1 THIRD up ---------------------------------------------------------------
========================================================================== */
}
@media only screen and (min-width: 768px) {
/* ==========================================================================
2 THIRDS up
========================================================================== */
.feed_list {
padding-left: 10%;
}
.feed_list li {
float: left;
width: 33%;
margin-bottom: 4px;
}
.main_feed {
margin-bottom: 0;
}
}
@media only screen and (min-width: 1140px) {
/* ==========================================================================
FULL WIDTH
========================================================================== */
}
/* ========
PAGINANA
======== */
.filter_group {
border-top: 1px solid #E7E7E7;
border-bottom: 1px solid #E7E7E7;
padding: 8px 0;
margin-bottom: 20px;
}
#keyword_filter.filter_group.standard {
padding-top: 18px;
padding-bottom: 0;
}
.filter_group h3 {
font-size: 93%;
font-weight: normal;
margin: 0 0 0 0;
padding: 6px 0 0 0;
}
#date_select.search_filter h3 {
padding-bottom: 14px;
}
#date_select.search_filter input {
width: 50%;
}
#date_select.search_filter.border {
padding: 16px 0;
border-top: 1px solid #E7E7E7;
border-bottom: 1px solid #E7E7E7;
}
#search_filters {
margin-bottom: 15px;
}
div.release_list h1 {
margin-top: 0;
}
.search_filter {
margin-bottom: 12px;
}
.search_filter h2 {
margin: 0 0 0 0;
padding: 6px 0 0 0;
font-weight: normal;
font-size: 100%;
}
.release_filters {
margin-top: 10px;
}
span.date_range {
float: left;
padding: 8px;
margin-right: 6px;
background: #E7E7E7;
}
span.date_range.from {
margin-right: 0;
}
span.date_range.to {
background: transparent;
margin-right: 0;
padding: 8px 4px;
}
.paginator_list {
float: right;
width: auto;
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
}
.paginator li {
float: left;
border-bottom: 3px solid #e7e7e7;
margin: 0 4px 0 0;
text-align: center;
}
.paginator li a {
background: none repeat scroll 0 0 transparent;
color: #666;
display: inline;
float: left;
padding: 8px;
min-width: 35px;
text-decoration: none;
outline: none;
}
.paginator li.current {
width: 35px;
border-bottom: 3px solid #999;
padding: 8px;
}
.paginator li.navigator a {
color: #006699;
}
.paginator_info {
margin: 6px 6px 0 0;
}
.paginator_list {
float: none;
}
.cat_selector {
font-size: 80%;
padding: 20px 0 0 0;
margin: 0;
width: 100%;
}
.cat_selector li {
font-family: "Mada", Arial, sans-serif;
width: auto;
float: left;
padding: 8px;
margin: 0 6px 6px 0;
border: 1px solid #e7e7e7;
background: #E7E7E7;
cursor: pointer;
}
.cat_selector li label {
cursor: pointer;
}
.cat_selector li input {
padding: 0;
margin: 0;
width: 25px;
}
#adv_search {
cursor: pointer;
}
#adv_search #more {
display: inline;
}
#adv_search #less {
display: none;
}
#adv_search.open #more {
display: none;
}
#adv_search.open #less {
display: inline;
}
#adv_search_content {
display: none;
margin: 20px 0 0 0;
}
#date_search {
margin-top: 20px;
}
.form_area label.error {
display: block;
color: #ff0033;
margin-top: 12px;
}
li.enabled {
background: #0093C9 !important;
border-color: #0093C9;
color: #fff;
}
.options_expand {
font-size: 80%;
margin: 10px 0 0 0;
float: left;
}
@media only screen and (min-width: 768px) {
/* ==========================================================================
2 THIRDS up
========================================================================== */
.release_filters {
float: right;
width: 80%;
margin-top: 0;
}
.search_filter h2 {
float: left;
width: 20%;
}
#date_select.filter_group h3 {
float: left;
font-size: 100%;
font-weight: normal;
margin: 0;
padding: 6px 0 0;
width: 20%;
}
#date_select.search_filter {
border-bottom: 1px solid #E7E7E7;
padding-bottom: 20px;
}
#date_select.search_filter input {
width: 20%;
}
}
/* ==============
JOURDASH BOARD
============== */
/*Could make this global*/
#JOURNALIST_LOGIN a, .footer_section a {
text-decoration: none;
}
#views_ul .sub_menu {
margin-top: 0;
}
/* ==============
ARCHIVE BOARD
============== */
.archive {
padding-bottom: 40px;
}
.archive .tag_list {
text-indent: 0;
padding: 8px;
margin: 2px;
float: left;
display: inline;
border-bottom: none;
}
.archive .tag_list {
padding: 0;
font-size: 120%;
color: #333;
background: none;
}
.archive li {
margin-bottom: 1%;
}
.archive li a {
color: #006699;
line-height: 1.6em;
text-decoration: none;
}
.archive li a:hover {
text-decoration: underline;
}
.archive_list li {
margin-bottom: 10px;
padding: 0 0 10px 10px;
font-size: 120%;
border-bottom: 1px dotted #ccc;
}
.archive p.release_date {
display: inline-block;
margin: 0;
padding: 0 1% 0 0;
}
.archive h1 span {
color: #999999;
}
/* ============
INDEX STYLES
============ */
.index_message {
background-color: #575859;
border-bottom: 4px solid #61A233;
}
#what_is_sw h2 {
margin: 0 0 0 0;
font-size: 182%;
padding: 14px 0;
font-weight: lighter;
letter-spacing: -1px;
color: #fff;
clear: both;
}
.promo.padding {
border-width: 4px;
padding: 96px 0;
}
.padding {
border-width: 4px;
padding: 96px 0;
}
.padding.dashboard {
border-top: 0;
}
.promo.no_padding_top {
padding-top: 0;
}
.promo.no_padding_bottom {
padding-bottom: 0;
}
.home_line { /*border-style: solid none none none; border-width: 4px; border-color: #CCCCCC;*/
padding: 30px 0 60px;
}
/* .home_line.green { border-color: #61A233 !important; }
.home_line.magenta { border-color: #ff0066; }
.home_line.orange { border-color: #FBB611; }
.home_line.blue { border-color: #13A1E1 !important; }
.home_line.light_blue { border-color: #C0DDEA; }*/
.blog_whitey {
background: url("img/backgrounds/rollz.jpg") repeat scroll center center 100% auto rgba(0, 0, 0, 0);
border-top: 3px solid #CCCCCC;
}
.promo.rollz {
background: url(img/backgrounds/rollz.jpg) no-repeat center center;
}
.img_promo {
width: 100%;
height: 500px;
background: url(img/backgrounds/sw_images_promo_dbl.jpg) center center;
border-bottom: 4px solid #ccc;
border-top: 8px solid #ccc;
}
@media handheld, only screen and (max-width: 768px) {
.mobile_center {
text-align: center;
}
}
@media only screen and (min-width: 768px) {
/* ==========================================================================
2 THIRDS up
========================================================================== */
.index_message {
background-color: transparent;
border-bottom: none;
padding-bottom: 30px;
}
#what_is_sw h2 {
color: #4F4F4F;
}
.home_divider {
height: 0px;
background: #ccc;
border-top: 4px solid #ccc;
}
}
@media only screen and (min-width: 1140px) {
/* ==========================================================================
FULL WIDTH
========================================================================== */
.promo.rollz {
background-size: 100%;
}
}
#sw_search_form {
margin-bottom: 50px;
}
section#images ul {
margin: 0;
padding: 0;
list-style: none;
}
section#images ul li {
position: relative;
margin: 0 0 12px 0;
padding: 0;
border-radius: 4px;
}
section#images ul li img {
max-width: 100%;
max-height: 500px;
padding: 0;
}
section#images ul li p {
position: absolute;
left: 0;
bottom: 0;
opacity: 0;
height: 0;
}
/*IE8 fixes to caption text over images used on /news/*/
.lt-ie9 section#images ul li p {
bottom: -10px;
}
.lt-ie9 section#images ul li:hover p {
bottom: 0;
}
section#images ul li p a {
color: #fff;
text-decoration: none;
}
/* class given to the when a user hovers over the release on the results lists */
section#images ul li.rel_highlight p, section#images ul li:hover p {
padding: 6px;
margin: 0;
transition: all 0.5s ease;
opacity: 1;
height: auto;
background-color: rgb(51, 51, 51);
background-color: rgba(51, 51, 51, 0.7);
}
/* ==========================================================================
CHANNELS | image / video channel
========================================================================== */
.release_image {
margin: 0 0 26px 0;
}
.release_image article {
padding-left: 4px;
}
.release_image img {
max-width: 100%;
}
.release_image a {
font-size: 100%;
text-decoration: none;
color: #666;
}
.release_image h3 {
font-weight: normal;
}
form.search.refine {
text-align: left;
margin-bottom: 20px;
}
form.search.refine input {
padding: 8px;
}
@media only screen and (min-width: 768px) {
/* ==========================================================================
2 THIRDS up
========================================================================== */
.image_list {
clear: both;
padding: 20px 0;
}
.release_image {
float: left;
width: 31%;
margin: 0 3% 26px 0;
}
.release_image a:hover h3 {
text-decoration: underline;
color: #333;
}
.release_image .text_hold p {
margin-bottom: 0;
}
.channel_list .paginator {
width: 60%;
float: left;
}
form.search.refine {
width: 40%;
float: right;
}
form.search.refine input {
float: right;
padding: 8px;
}
}
/* =====================================
FEEDS SUCCESS
===================================== */
#feeds_success {
font-family: "Mada", Arial, sans-serif;
font-size: 20px;
font-size: 2rem;
}
#feeds_success h2 {
font-weight: normal;
margin-top: 0;
margin-bottom: 12px;
}
#feeds_success p {
margin-bottom: 48px;
line-height: 1.6;
}
#feeds_success a {
word-break: break-all;
text-decoration: none;
}
#feeds_success a:hover {
text-decoration: underline;
}
#feeds_success pre {
font-family: "Courier New" Courier monospace;
font-size: 16px;
font-size: 1.6rem;
padding: 3%;
margin: 0 0;
}
.placeholder {
color: #aaa;
}
.input-text-upload {
padding: 6px;
}
#theme_tab input {
padding: 6px;
}
.css_success.theme {
width: 100%;
}
.newsroom_examples {
display: none;
height: 100%;
}
.newsroom_showcase {
border: 2px dashed #EAEAEA;
background-color: #fff;
height: 250px;
vertical-align: middle;
width: 100%;
}
/*Trying to standardise font sizes*/
.wrapper.font_st {
margin-bottom: 40px;
}
.font_st {
font-family: "Mada", Arial, sans-serif;
}
.font_st h2 {
font-size: 26px;
font-size: 2.6rem;
font-weight: normal;
}
.font_st h3 {
margin-top: 0;
font-size: 24px;
font-size: 2.4rem;
color: #333333;
}
.font_st a, .font_st p {
font-size: 20px;
font-size: 2rem;
text-decoration: none;
}
/*site map*/
.mliu_box.dual {
float: none;
width: 100%;
}
.font_st .mliu_box header {
margin: 40px 0 20px 0;
border-bottom: 1px solid #CCCCCC;
}
@media only screen and (min-width: 768px) {
/* ==========================================================================
1 THIRD up
========================================================================== */
.mliu_box.dual {
float: left;
width: 45.7%;
}
#sitemap .mliu_box.dual.right {
float: left;
width: 53%;
} /*small alteration to overide the standard used in mliu_core*/
.font_st .mliu_box header {
margin: 40px 20% 20px 0;
}
}
.font_st .mliu_box section:first-child header {
margin-top: 0;
}
.font_st .mliu_box ul li {
list-style: inside square;
}
/*target sitemap page tag_list only*/
#sitemap .tag_list li {
padding: 0;
list-style: none;
}
#sitemap .tag_list li, #sitemap .tag_list li:hover {
-webkit-transition: all 0.15s linear;
-o-transition: all 0.15s linear;
-moz-transition: all 0.15s linear;
-ms-transition: all 0.15s linear;
-kthtml-transition: all 0.15s linear;
transition: all 0.15s linear;
}
#sitemap .tag_list li a {
color: #333;
padding: 5px;
display: block;
}
#sitemap .tag_list li.green {
background-color: #A8C115;
}
#sitemap .tag_list li.green:hover {
background-color: #96AC15;
}
#sitemap .tag_list li.blue {
background-color: #82C0FF;
}
#sitemap .tag_list li.blue:hover {
background-color: #3498FD;
}
#sitemap .tag_list li.orange {
background-color: #FF9900;
}
#sitemap .tag_list li.orange:hover {
background-color: #FF6600;
}
#MAIN_PAGE {
padding: 40px 0;
}
/* ==========================================================================
404 page styling
========================================================================== */
.forohfor {
font-family: "futura-pt", Trebuchet MS, Arial, sans-serif;
font-weight: normal;
text-align: left;
padding: 20px;
margin: 50px 0 50px 0;
}
.forohfor img {
margin: 0 auto;
width: 95%;
max-width: 350px;
}
.forohfor h1 {
font-weight: 700;
font-size: 90px;
font-size: 9rem;
color: #333333;
padding: 0 0 0 0;
margin-bottom: 0;
}
.forohfor h2 {
font-weight: 500;
font-size: 26px;
font-size: 2.6rem;
color: #666666;
margin: 10px 0 10px 0;
}
.forohfor p {
font-size: 22px;
font-size: 2.2rem;
color: #999999;
line-height: 1.4em;
}
@media only screen and (min-width: 768px) {
.forohfor {
text-align: right;
}
.forohfor img {
float: left;
margin-top: 75px;
width: auto;
max-width: 500px;
}
}
span.hilite {
background: #B2D3FA;
color: #003300;
padding: 4px 0;
}
a.stats_pdf_download {
display: block;
width: 150px;
height: 33px;
padding: 2px 43px 2px 2px;
background: transparent url(img/icon/sprite_tools_article_34_32.gif) no-repeat 116px -63px;
font: normal 12px "Mada", Arial, sans-serif, Trebuchet MS, arial, verdana, sans-serif;
text-decoration: none;
}
a.stats_pdf_download:hover {
background-position: 116px -95px;
text-decoration: underline;
}
div.shadow.right {
float: right;
width: auto;
border: 1px solid #cccccc;
padding: 10px;
}
/*# sourceMappingURL=style-prw.css.map */