/**
* piece the main site file together so that whitelabelling can be done
* with a minimum of fuss. so we break things down into chunks...
*/
/**
* bring in all the bootstrap stuff for our site sass build
*/
/**
* we use bootstrap css + site css
*
* import the basic bootstrap framework for use in our own site stylesheet
* so we can use their mixins etc
*
* NB we have to make sure our "pre" and "post" bootstrap files are brought in properly
*/
/**
* overrides of the standard bootstrap variables
*/
/****************************************************
wish sass allowed $vars in import statements...
@import "../../../vendor/bootstrap/bootstrap-4.0.0-beta/scss/functions";
@import "../../../vendor/bootstrap/bootstrap-4.0.0-beta/scss/variables";
@import "../../../vendor/bootstrap/bootstrap-4.0.0-beta/scss/mixins";
****************************************************/
/**
* theme colors
*/
/**
* some handy color functions
*/
/**
* our color palettes
*/
/*************************************************************************************/
/******************** slowly adjust the following *********************************/
/* standard colors */
/******************** slowly adjust the above *********************************/
/*************************************************************************************/
/**
* Social media colors.
*/
/**
* On/off red and green.
*/
/**
* dropdowns
*/
/**
* our own reboot overrides
*/
ul {
padding-left: 0;
}
/**
* stuff related to typography
*/
html, body {
font-size: 16px !important;
}
/**
* STRIP UNIT
* It strips the unit of measure and returns it
*/
/**
* CONVERT TO REM
*/
/**
* REM CALC
* Allows to optionally calculate on a different base value to counter compounding effect of rem's.
* Call with 1, 2, 3 or 4 parameters, 'px' is not required but supported:
*
* rem-calc(10 20 30px 40);
*
* Space delimited, if you want to delimit using comma's, wrap it in another pair of brackets
*
* rem-calc((10, 20, 30, 40px));
*
* Optionally call with a different base (eg: 8px) to calculate rem.
*
* rem-calc(16px 32px 48px, 8px);
*
* If you require to comma separate your list
*
* rem-calc((16px, 32px, 48), 8px);
*/
/**
* smooth fonts
*/
/**
* Conduit ITC*
*/
@font-face {
font-family: Conduit-ITC-Pro-Med;
src: url("/fonts/white_labels/artsfront/conduit-itc-pro-med.woff2") format("woff2"), url("/fonts/white_labels/artsfront/conduit-itc-pro-med.woff") format("woff"), url("/fonts/white_labels/artsfront/conduit-itc-pro-med.ttf") format("truetype"), url("/fonts/white_labels/artsfront/conduit-itc-pro-med.svg#svgFontName") format("svg"); /* Legacy iOS */
}
@font-face {
font-family: Conduit-ITC-W05-Med;
src: url("/fonts/white_labels/artsfront/conduit-itc-w05-med.woff2") format("woff2"), url("/fonts/white_labels/artsfront/conduit-itc-w05-med.woff") format("woff"), url("/fonts/white_labels/artsfront/conduit-itc-w05-med.ttf") format("truetype"), url("/fonts/white_labels/artsfront/conduit-itc-w05-med.svg#svgFontName") format("svg"); /* Legacy iOS */
}
/**
* DIN*
*/
@font-face {
font-family: DIN-Bold;
src: url("/fonts/white_labels/artsfront/din-bold.woff2") format("woff2"), url("/fonts/white_labels/artsfront/din-bold.woff") format("woff"), url("/fonts/white_labels/artsfront/din-bold.ttf") format("truetype"), url("/fonts/white_labels/artsfront/din-bold.svg#svgFontName") format("svg"); /* Legacy iOS */
}
@font-face {
font-family: DIN-Reg;
src: url("/fonts/white_labels/artsfront/din-reg.woff2") format("woff2"), url("/fonts/white_labels/artsfront/din-reg.woff") format("woff"), url("/fonts/white_labels/artsfront/din-reg.ttf") format("truetype"), url("/fonts/white_labels/artsfront/din-reg.svg#svgFontName") format("svg"); /* Legacy iOS */
}
/**
* Franklin Gothic URW*
*/
@font-face {
font-family: FranklinGothicURW-Book;
src: url("/fonts/white_labels/artsfront/franklin-gothic-urw-book.woff2") format("woff2"), url("/fonts/white_labels/artsfront/franklin-gothic-urw-book.woff") format("woff"), url("/fonts/white_labels/artsfront/franklin-gothic-urw-book.ttf") format("truetype"), url("/fonts/white_labels/artsfront/franklin-gothic-urw-book.svg#svgFontName") format("svg"); /* Legacy iOS */
}
@font-face {
font-family: FranklinGothicURW-Light;
src: url("/fonts/white_labels/artsfront/franklin-gothic-urw-light.woff2") format("woff2"), url("/fonts/white_labels/artsfront/franklin-gothic-urw-light.woff") format("woff"), url("/fonts/white_labels/artsfront/franklin-gothic-urw-light.ttf") format("truetype"), url("/fonts/white_labels/artsfront/franklin-gothic-urw-light.svg#svgFontName") format("svg"); /* Legacy iOS */
}
@font-face {
font-family: FranklinGothicURW-Med;
src: url("/fonts/white_labels/artsfront/franklin-gothic-urw-med.woff2") format("woff2"), url("/fonts/white_labels/artsfront/franklin-gothic-urw-med.woff") format("woff"), url("/fonts/white_labels/artsfront/franklin-gothic-urw-med.ttf") format("truetype"), url("/fonts/white_labels/artsfront/franklin-gothic-urw-med.svg#svgFontName") format("svg"); /* Legacy iOS */
}
/**
* Franklin Gothic* - variations on the URW versions (we had issues with macrons etc)
*/
@font-face {
font-family: FranklinGothic-Book-Reg;
src: url("/fonts/white_labels/artsfront/franklin-gothic-book-reg.woff2") format("woff2"), url("/fonts/white_labels/artsfront/franklin-gothic-book-reg.woff") format("woff"), url("/fonts/white_labels/artsfront/franklin-gothic-book-reg.ttf") format("truetype"), url("/fonts/white_labels/artsfront/franklin-gothic-book-reg.svg#svgFontName") format("svg"); /* Legacy iOS */
}
@font-face {
font-family: FranklinGothic-Med-Reg;
src: url("/fonts/white_labels/artsfront/franklin-gothic-med-reg.woff2") format("woff2"), url("/fonts/white_labels/artsfront/franklin-gothic-med-reg.woff") format("woff"), url("/fonts/white_labels/artsfront/franklin-gothic-med-reg.ttf") format("truetype"), url("/fonts/white_labels/artsfront/franklin-gothic-med-reg.svg#svgFontName") format("svg"); /* Legacy iOS */
}
/**
* Source Sans Pro*
*/
@font-face {
font-family: SourceSansProLight;
src: url("/fonts/white_labels/artsfront/source-sans-pro-light.woff2") format("woff2"), url("/fonts/white_labels/artsfront/source-sans-pro-light.woff") format("woff"), url("/fonts/white_labels/artsfront/source-sans-pro-light.ttf") format("truetype"), url("/fonts/white_labels/artsfront/source-sans-pro-light.svg#svgFontName") format("svg"); /* Legacy iOS */
}
/**
* Theano Didot*
*/
@font-face {
font-family: TheanoDidotReg;
src: url("/fonts/white_labels/artsfront/theanodidot-reg.woff2") format("woff2"), url("/fonts/white_labels/artsfront/theanodidot-reg.woff") format("woff"), url("/fonts/white_labels/artsfront/theanodidot-reg.ttf") format("truetype"), url("/fonts/white_labels/artsfront/theanodidot-reg.svg#svgFontName") format("svg"); /* Legacy iOS */
}
/**
* Trade Gothic LT*
*/
@font-face {
font-family: TradeGothicLTStd-BdCn20;
src: url("/fonts/white_labels/artsfront/tradegothicltstd-bdcn20.woff2") format("woff2"), url("/fonts/white_labels/artsfront/tradegothicltstd-bdcn20.woff") format("woff"), url("/fonts/white_labels/artsfront/tradegothicltstd-bdcn20.ttf") format("truetype"), url("/fonts/white_labels/artsfront/tradegothicltstd-bdcn20.svg#svgFontName") format("svg"); /* Legacy iOS */
}
@font-face {
font-family: TradeGothicLTStd-BdCn20Obl;
src: url("/fonts/white_labels/artsfront/tradegothicltstd-bdcn20obl.woff2") format("woff2"), url("/fonts/white_labels/artsfront/tradegothicltstd-bdcn20obl.woff") format("woff"), url("/fonts/white_labels/artsfront/tradegothicltstd-bdcn20obl.ttf") format("truetype"), url("/fonts/white_labels/artsfront/tradegothicltstd-bdcn20obl.svg#svgFontName") format("svg"); /* Legacy iOS */
}
@font-face {
font-family: TradeGothicLTStd-Cn18;
src: url("/fonts/white_labels/artsfront/tradegothicltstd-cn18.woff2") format("woff2"), url("/fonts/white_labels/artsfront/tradegothicltstd-cn18.woff") format("woff"), url("/fonts/white_labels/artsfront/tradegothicltstd-cn18.ttf") format("truetype"), url("/fonts/white_labels/artsfront/tradegothicltstd-cn18.svg#svgFontName") format("svg"); /* Legacy iOS */
}
/**
* Code New Roman*
*/
@font-face {
font-family: CodeNewRoman;
src: url("/fonts/white_labels/artsfront/code-new-roman.woff2") format("woff2"), url("/fonts/white_labels/artsfront/code-new-roman.woff") format("woff"), url("/fonts/white_labels/artsfront/code-new-roman.ttf") format("truetype"), url("/fonts/white_labels/artsfront/code-new-roman.svg#code-new-roman") format("svg"); /* Legacy iOS */
}
@font-face {
font-family: CodeNewRomanBold;
src: url("/fonts/white_labels/artsfront/code-new-roman-bold.woff2") format("woff2"), url("/fonts/white_labels/artsfront/code-new-roman-bold.woff") format("woff"), url("/fonts/white_labels/artsfront/code-new-roman-bold.ttf") format("truetype"), url("/fonts/white_labels/artsfront/code-new-roman-bold.svg#code-new-roman-bold") format("svg"); /* Legacy iOS */
}
@font-face {
font-family: CodeNewRomanItalic;
src: url("/fonts/white_labels/artsfront/code-new-roman-italic.woff2") format("woff2"), url("/fonts/white_labels/artsfront/code-new-roman-italic.woff") format("woff"), url("/fonts/white_labels/artsfront/code-new-roman-italic.ttf") format("truetype"), url("/fonts/white_labels/artsfront/code-new-roman-italic.svg#code-new-roman-italic") format("svg"); /* Legacy iOS */
}
/**
* Express the above as mixins.
*/
/*************
For cutting and pasting:
@include font-system;
@include font-plain;
@include font-plain-bold;
@include font-monospace;
@include font-conduit-itc-pro-med;
@include font-conduit-itc-w05-med;
@include font-din-bold;
@include font-din-reg;
@include font-franklingothic-urw-book;
@include font-franklingothic-urw-light;
@include font-franklingothic-urw-med;
@include font-franklingothic-book;
@include font-franklingothic-med;
@include font-source-sans-pro-light;
@include font-teano-didot-reg;
@include font-tradegothic-ltstd-bdcn20;
@include font-tradegothic-ltstd-bdcn20-italic;
@include font-tradegothic-ltstd-cn18;
@include font-code-new-roman;
@include font-code-new-roman-bold;
@include font-code-new-roman-italic;
*************/
/**
* mixins
*/
/**
* hamburger animation in css. this is for drawing a hamburger
* purely in css, which responds to hover in the parent, and
* has awareness of being "on", which means the hamburger was
* clicked and a menu is being displayed.
*
* this mixin should be included within the scope of the hamburger's
* parent element's css.
*
* http://elijahmanor.com/css-animated-hamburger-icon/
*/
/**
* centering
*/
/* see: https://css-tricks.com/centering-in-the-unknown/ */
/**
* momentum scrolling on iOS
*/
/**
* user select none
*/
/**
* a triple line above
*/
/**
* Add a background color to text, that wraps with the text, instead of covering the whole "block".
*/
/**
* Add a "transparency gauze" over an element
*/
/**
* Arrows.
*/
/**
* DO NOT EDIT - CACHEBUSTED AUTOMATICALLY
*/
/**
* some handy color functions
*/
/**
* our color palettes
*/
/*************************************************************************************/
/******************** slowly adjust the following *********************************/
/* standard colors */
/******************** slowly adjust the above *********************************/
/*************************************************************************************/
/**
* Social media colors.
*/
/**
* On/off red and green.
*/
/**
* configuration variables that help us white label the site easily
*/
/*
|--------------------------------------------------------------------------
| fonts
|--------------------------------------------------------------------------
*/
/****************************************************/
/****************** resolve below ******************/
/****************** resolve above ******************/
/****************************************************/
/*
|--------------------------------------------------------------------------
| colors
|--------------------------------------------------------------------------
*/
/***************************************************************/
/********************** resolve below **************************/
/* gradient sets */
/********************** resolve above **************************/
/***************************************************************/
/**
* links
*/
/**
* dialogs
*/
/**
* some extra stuff related to bootstrap layouts that isn't
* directly involved with tweaking bootstrap "builds"
*/
/**
* some handy embellishments to container/row/col classes
*/
.container {
padding-left: 20px;
padding-right: 20px;
}
@media (min-width: 768px) {
.container {
padding-left: 15px;
padding-right: 15px;
}
}
.container-trim {
padding-left: 0 !important;
padding-right: 0 !important;
}
.row.row-fat {
margin-left: 0 !important;
margin-right: 0 !important;
}
.col-trim {
padding-left: 0 !important;
padding-right: 0 !important;
}
.col-trim-left {
padding-left: 0 !important;
}
.col-trim-right {
padding-right: 0 !important;
}
.col-center {
margin-left: auto !important;
margin-right: auto !important;
float: none !important;
}
/*
|--------------------------------------------------------------------------
| some custom gutter widths to use over and above the standard one
|--------------------------------------------------------------------------
*/
.row.row-narrow {
margin-left: -10px !important;
margin-right: -10px !important;
}
.row.row-narrow > .col, .row.row-narrow > [class*=col-] {
padding-left: 10px !important;
padding-right: 10px !important;
}
.row.row-xnarrow {
margin-left: -5px !important;
margin-right: 0;
}
.row.row-xnarrow > .col, .row.row-xnarrow > [class*=col-] {
padding-left: 5px !important;
padding-right: 5px !important;
}
.row.row-xxnarrow {
margin-left: -2.5px !important;
margin-right: 0;
}
.row.row-xxnarrow > .col, .row.row-xxnarrow > [class*=col-] {
padding-left: 2.5px !important;
padding-right: 2.5px !important;
}
.row.row-tight {
margin-left: 0 !important;
margin-right: 0 !important;
}
.row.row-tight > .col, .row.row-tight > [class*=col-] {
padding-left: 0 !important;
padding-right: 0 !important;
}
.row.row-only-tight {
margin-left: 0 !important;
margin-right: 0 !important;
}
.row.row-full-outside {
margin-left: -15px !important;
margin-right: -15px !important;
}
/**
* buttons
*/
.btn {
font-family: Conduit-ITC-W05-Med;
font-weight: bold;
cursor: pointer;
line-height: 1;
padding: 0.4rem 0.6rem;
text-transform: uppercase;
}
.btn:disabled {
cursor: default;
}
.btn.btn-cancel, .btn.btn-cancel:link, .btn.btn-cancel:visited {
color: #c1c3c4;
border-color: #c1c3c4;
}
.btn.btn-cancel:hover, .btn.btn-cancel:active {
color: #6d6e71;
border-color: #6d6e71;
}
.btn.btn-grey-black, .btn.btn-grey-black:link, .btn.btn-grey-black:visited {
color: #6d6e71;
border-color: #6d6e71;
background-color: #fff;
}
.btn.btn-grey-black:hover, .btn.btn-grey-black:active {
color: #000;
border-color: #000;
background-color: #fff;
}
.btn.btn-white-black, .btn.btn-white-black:link, .btn.btn-white-black:visited {
color: #fff !important;
background-color: #000 !important;
}
.btn.btn-white-black:hover, .btn.btn-white-black:active {
color: #fff !important;
background-color: #000 !important;
}
.btn.btn-white-black:disabled, .btn.btn-white-black[disabled=disabled] {
background-color: #4d4d4d !important;
}
.btn.btn-white-black-2, .btn.btn-white-black-2:link, .btn.btn-white-black-2:visited {
color: #000 !important;
border: 2px solid #000 !important;
background-color: transparent !important;
}
.btn.btn-white-black-2:hover, .btn.btn-white-black-2:active {
color: #fff !important;
background-color: #000 !important;
}
.btn.btn-white-black-2:disabled, .btn.btn-white-black-2[disabled=disabled] {
background-color: #4d4d4d !important;
}
.btn.btn-white-black-3, .btn.btn-white-black-3:link, .btn.btn-white-black-3:visited {
color: #000 !important;
border: 1px solid #000 !important;
background-color: transparent !important;
}
.btn.btn-white-black-3:hover, .btn.btn-white-black-3:active {
color: #fff !important;
background-color: #000 !important;
}
.btn.btn-white-black-3:disabled, .btn.btn-white-black-3[disabled=disabled] {
background-color: #4d4d4d !important;
}
.btn.btn-white-black-4, .btn.btn-white-black-4:link, .btn.btn-white-black-4:visited {
color: #000 !important;
border: 1px solid #000 !important;
background-color: transparent !important;
}
.btn.btn-white-black-4:hover, .btn.btn-white-black-4:active {
color: #fff !important;
background-color: #000 !important;
}
.btn.btn-white-black-4:disabled, .btn.btn-white-black-4[disabled=disabled] {
background-color: #4d4d4d !important;
}
.btn-white-no-border, .btn-white-no-border:link, .btn-white-no-border:visited, .btn-white-no-border:hover, .btn-white-no-border:active {
color: #fff !important;
border: none !important;
}
.btn-upper {
text-transform: uppercase;
}
.btn-heavy {
font-weight: bold;
}
.btn-light {
font-weight: normal;
}
.btn-white {
color: #fff !important;
}
.btn-no-border {
border: none !important;
}
.btn-icon-only:after {
display: none;
}
.btn-transp {
background-color: transparent;
border-color: transparent;
}
.btn-sm {
padding: 0.25rem 0.3rem;
}
.btn-xs {
font-size: 13px !important;
font-weight: normal;
padding: 3px 6px;
}
.btn-xxs {
font-size: 11px !important;
font-weight: normal;
padding: 1px 5px;
}
.btn-xlg {
font-size: 26px !important;
font-weight: bold;
padding: 6px 8px;
}
.btn-group-checkbox-buttons .btn {
margin-bottom: 0.25rem;
}
.btn-group-checkbox-buttons .btn.btn-outline-primary:hover, .btn-group-checkbox-buttons .btn.btn-outline-primary:active, .btn-group-checkbox-buttons .btn.btn-primary:hover, .btn-group-checkbox-buttons .btn.btn-primary:active {
background-color: #d8225e;
}
.btn-group-checkbox-buttons.lg .btn {
margin-right: 0.75rem;
margin-bottom: 0.75rem;
}
.btn-group-radio-buttons .btn.btn-outline-primary:hover, .btn-group-radio-buttons .btn.btn-outline-primary:active, .btn-group-radio-buttons .btn.btn-primary:hover, .btn-group-radio-buttons .btn.btn-primary:active {
background-color: #d8225e;
}
/**
* forms
*/
input[type=submit] {
font-family: Conduit-ITC-W05-Med;
font-weight: bold;
}
.form-check-label {
padding-left: 0;
}
/**
* progress bars
*/
.progress.text-overlay {
position: relative;
}
.progress.text-overlay .text {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
color: #000;
font-size: 0.8125rem;
font-weight: bold;
}
.progress.gt-50.text-overlay .text {
color: #fff;
}
.progress.progress-lg .progress-bar {
height: 1.5rem;
}
.progress.progress-xlg .progress-bar {
height: 2rem;
}
/*
|--------------------------------------------------------------------------
| dropdowns
|--------------------------------------------------------------------------
*/
.dropdown-sm {
font-size: 0.875rem;
}
.dropdown-sm .dropdown-item {
font-size: 0.875rem;
}
.dropdown-item.active, .dropdown-item:active {
color: #fff !important;
background-color: #d8225e !important;
}
.dropdown-item-toggle .ico-tick {
visibility: hidden;
}
.dropdown-item-toggle.on .ico-tick {
visibility: visible;
}
.dropdown-black .dropdown-item {
color: #000 !important;
background-color: transparent !important;
}
.dropdown-black .dropdown-item:hover, .dropdown-black .dropdown-item:active {
background-color: #e6e6e6 !important;
}
/*
|--------------------------------------------------------------------------
| progress bars
|--------------------------------------------------------------------------
*/
.progress.progress-thin {
height: 12px;
}
.progress.progress-vthin {
height: 5px;
}
.progress .progress-bar {
-webkit-transition: width 0.3s ease;
-o-transition: width 0.3s ease;
transition: width 0.3s ease;
}
/**
* General stuff to pull in after white label stuff set.
*/
/**
* blinking disc
*/
@-webkit-keyframes blinking-disc {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes blinking-disc {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
/**
* some extensions of the bootstrap buttons
*/
.btn-style2 {
color: #fff !important;
background-color: #808080 !important;
}
.btn-style2:hover, .btn-style2:active {
color: #fff !important;
background-color: #d8225e !important;
}
/*
|--------------------------------------------------------------------------
| font awesome support
|--------------------------------------------------------------------------
*/
.btn .ico {
margin-right: 3px;
}
/*
|--------------------------------------------------------------------------
| simple ico buttons
|--------------------------------------------------------------------------
*/
.btn-ico {
text-decoration: none !important;
cursor: pointer;
border: none !important;
display: inline-block;
padding: 0 !important;
background-color: transparent;
font-size: 1rem;
line-height: 1;
}
.btn-ico:disabled, .btn-ico.disabled {
cursor: default;
pointer-events: none;
}
.btn-ico.btn-ico-simple1 .text {
display: none;
}
.btn-ico.btn-ico-simple2:hover, .btn-ico.btn-ico-simple2:active {
color: #c21f54;
}
.btn-ico.btn-ico-simple3:hover, .btn-ico.btn-ico-simple3:active {
color: #000;
}
.btn-ico .ico-lg, .btn-ico .ico-larger {
font-size: 1.125rem;
}
.btn-ico .ico-xlg {
font-size: 1.25rem;
}
.btn-ico .ico-xxlg {
font-size: 1.5rem;
}
.btn-ico .ico-xxxlg {
font-size: 1.75rem;
}
/**
* "follow" button styles
*/
.btn-follow[data-on="1"] .on {
display: inline-block;
}
.btn-follow[data-on="1"] .off {
display: none;
}
.btn-follow[data-on="0"] .on {
display: none;
}
.btn-follow[data-on="0"] .off {
display: inline-block;
}
/**
* Session Navigator / Live Console button
*/
.sess-nav-btn, .event-live-console-btn {
display: inline-block;
font-family: Conduit-ITC-Pro-Med;
background-color: #328e3e;
}
.sess-nav-btn, .sess-nav-btn:link, .sess-nav-btn:visited, .event-live-console-btn, .event-live-console-btn:link, .event-live-console-btn:visited {
color: #fff !important;
background-color: #328e3e !important;
text-decoration: none !important;
}
.sess-nav-btn:hover, .sess-nav-btn:active, .event-live-console-btn:hover, .event-live-console-btn:active {
color: #fff !important;
background-color: #38a147 !important;
text-decoration: none !important;
}
.sess-nav-btn .ico, .event-live-console-btn .ico {
color: #fff;
}
.sess-nav-btn.sm, .sess-nav-btn.btn-sm, .event-live-console-btn.sm, .event-live-console-btn.btn-sm {
font-size: 1rem;
padding: 5px 10px 6px;
border-radius: 3px;
}
.sess-nav-btn.sm .ico, .sess-nav-btn.btn-sm .ico, .event-live-console-btn.sm .ico, .event-live-console-btn.btn-sm .ico {
margin-right: 7px;
color: #fff;
}
.sess-nav-btn.lg, .sess-nav-btn.btn-lg, .event-live-console-btn.lg, .event-live-console-btn.btn-lg {
font-size: 1.625rem;
padding: 10px 15px 8px;
border-radius: 6px;
}
.sess-nav-btn.lg .ico, .sess-nav-btn.btn-lg .ico, .event-live-console-btn.lg .ico, .event-live-console-btn.btn-lg .ico {
margin-right: 10px;
color: #fff;
}
.sess-nav-btn.lg .ico.admins-only, .sess-nav-btn.btn-lg .ico.admins-only, .event-live-console-btn.lg .ico.admins-only, .event-live-console-btn.btn-lg .ico.admins-only {
margin: 0 0 0 10px;
font-size: 15px;
position: relative;
top: -8px;
}
/**
* Action Presentation button
*/
.action-presentation-btn {
display: inline-block;
font-family: Conduit-ITC-Pro-Med;
font-size: 1.25rem;
padding: 8px 10px 6px;
background-color: #21a0ff;
border-radius: 6px;
}
.action-presentation-btn .ico {
margin-right: 8px;
color: #fff;
}
.action-presentation-btn, .action-presentation-btn:link, .action-presentation-btn:visited {
color: #fff !important;
background-color: #21a0ff !important;
text-decoration: none;
}
.action-presentation-btn:hover, .action-presentation-btn:active {
color: #fff !important;
background-color: #3babff !important;
text-decoration: none;
}
.action-presentation-btn.lg {
font-size: 1.625rem;
padding: 10px 15px 8px;
}
.action-presentation-btn.lg .ico {
margin-right: 10px;
}
/* -------------------------------------------------------------------------- */
/* ----------- TODO resolve ---------------------------------------------- */
/**
* our own button styling
*
* NB we use btn2, btn3 etc (not btn) as bootstrap has its own btn class, and we don't
* want our styles to bump into each other
*/
.btn2, .btn2-black, .btn2-black-sml, .btn2-red, .btn2-red-metric, .btn2-red-sml {
cursor: pointer;
text-decoration: none !important;
text-transform: uppercase;
border: none !important;
border-radius: 3px;
line-height: 1.2;
display: inline-block;
font-family: FranklinGothic-Book-Reg;
font-size: 0.875rem;
font-weight: bold;
padding: 0.375rem 0.625rem !important;
}
.btn2:disabled, .btn2-black:disabled, .btn2-black-sml:disabled, .btn2-red:disabled, .btn2-red-metric:disabled, .btn2-red-sml:disabled {
cursor: default;
}
.btn2.btn2-sm, .btn2-sm.btn2-black, .btn2-sm.btn2-red, .btn2-sm.btn2-red-metric, .btn2.sml, .sml.btn2-black, .btn2-black-sml, .sml.btn2-red, .sml.btn2-red-metric, .btn2-red-sml {
font-size: 0.75rem;
padding: 0.3125rem 0.5rem !important;
}
.btn2.btn2-lg, .btn2-lg.btn2-black, .btn2-lg.btn2-black-sml, .btn2-lg.btn2-red, .btn2-lg.btn2-red-metric, .btn2-lg.btn2-red-sml {
font-size: 1.125rem;
padding: 0.625rem 0.9375rem !important;
}
.btn2 .ico, .btn2-black .ico, .btn2-black-sml .ico, .btn2-red .ico, .btn2-red-metric .ico, .btn2-red-sml .ico {
margin-right: 3px;
}
input.btn2, input.btn2-black, input.btn2-black-sml, input.btn2-red, input.btn2-red-metric, input.btn2-red-sml {
padding: 0.375rem 0.625rem !important;
}
button.btn2, button.btn2-black, button.btn2-black-sml, button.btn2-red, button.btn2-red-metric, button.btn2-red-sml {
padding: 0.375rem 0.625rem !important;
}
/*
** btn2-red white on clr-red-1
*/
.btn2-red, .btn2-red-metric, .btn2-red-sml, .btn2-red:link, .btn2-red:visited {
color: #fff !important;
background-color: #cd2027 !important;
}
.btn2-red:hover, .btn2-red-metric:hover, .btn2-red-sml:hover, .btn2-red:active, .btn2-red-metric:active, .btn2-red-sml:active {
background-color: #a1191f !important;
}
.btn2-red:disabled, .btn2-red-metric:disabled, .btn2-red-sml:disabled {
background-color: #e13f46 !important;
}
/*
** btn2-red-metric white on clr-red-1
*/
/*
** btn2-black white on #333
*/
.btn2-black, .btn2-black-sml, .btn2-black:link, .btn2-black:visited {
color: #fff !important;
background-color: #333 !important;
}
.btn2-black:hover, .btn2-black-sml:hover, .btn2-black:active, .btn2-black-sml:active, .btn2-black:not(:disabled), .btn2-black-sml:not(:disabled) {
color: #fff !important;
background-color: #1a1a1a !important;
}
.btn2-black:disabled, .btn2-black-sml:disabled {
background-color: #4d4d4d !important;
pointer-events: none;
cursor: default;
}
.btn3, .btn3-pink, .btn3-pink-lge {
text-decoration: none !important;
cursor: pointer;
text-transform: uppercase;
display: inline-block;
border-radius: 0;
font-family: TradeGothicLTStd-Cn18;
font-size: 1.125rem;
padding: 0.5rem 0.625rem !important;
-webkit-box-shadow: 3px 3px 0 0 #6d6e71;
box-shadow: 3px 3px 0 0 #6d6e71;
}
.btn3:disabled, .btn3-pink:disabled, .btn3-pink-lge:disabled {
cursor: default;
}
.btn3.sml, .sml.btn3-pink, .sml.btn3-pink-lge, .btn3.btn2-red-sml, .btn2-red-sml.btn3-pink, .btn2-red-sml.btn3-pink-lge, .btn3.btn2-black-sml, .btn2-black-sml.btn3-pink, .btn2-black-sml.btn3-pink-lge {
font-size: 0.875rem;
padding: 0.3125rem 0.5rem !important;
}
.btn3.lge, .lge.btn3-pink, .btn3-pink-lge {
font-size: 1.75rem;
padding: 0.3125rem 0.5rem !important;
-webkit-box-shadow: 5px 5px 0 0 #6d6e71;
box-shadow: 5px 5px 0 0 #6d6e71;
}
input.btn3, input.btn3-pink, input.btn3-pink-lge {
padding: 0.5rem 0.625rem 0.3125rem !important;
}
.btn3-pink, .btn3-pink-lge, .btn3-pink:link, .btn3-pink:visited {
color: #fff !important;
background-color: #da1c5c !important;
}
.btn3-pink:hover, .btn3-pink-lge:hover, .btn3-pink:active, .btn3-pink-lge:active {
background-color: #c31952 !important;
}
.btn3-pink:disabled, .btn3-pink-lge:disabled {
background-color: #e7427a !important;
}
.btn3-pink-lge.style2 {
font-family: TradeGothicLTStd-Cn18;
}
/* ----------- end to resolve -------------------------------------------- */
/* -------------------------------------------------------------------------- */
/**
* some simple list styles
*/
ul li {
list-style: none;
}
ul.horiz {
overflow: auto;
}
ul.horiz li {
float: left;
margin-right: 0.5rem;
}
ul.horiz li:last-child {
margin-right: 0;
}
/**
* general styles
*/
a:focus {
outline: 0;
}
/**
* a style for links that have no text
*/
.aimg, .astyle-img {
line-height: 0;
font-size: 0;
text-indent: -10000em;
}
/**
* Catchall style forall astyle* links, no color transitions.
*/
.astyle-no-trans {
cursor: pointer;
}
.astyle-no-trans, .astyle-no-trans:link, .astyle-no-trans:visited {
text-decoration: none !important;
}
.astyle-no-trans:hover, .astyle-no-trans:active {
text-decoration: underline !important;
}
/**
* Catchall style forall astyle* links, no underline.
*/
.astyle-no-ul, .astyle-no-ul:link, .astyle-no-ul:visited {
text-decoration: none !important;
}
.astyle-no-ul:hover, .astyle-no-ul:active {
text-decoration: none !important;
}
/**
* Catchall style forall astyle* links, always underline.
*/
.astyle-always-ul, .astyle-always-ul:link, .astyle-always-ul:visited {
text-decoration: underline !important;
}
.astyle-always-ul:hover, .astyle-always-ul:active {
text-decoration: underline !important;
}
/**
* Catchall style for links that transition on color.
*/
.astyle-color-transition {
-webkit-transition: color 0.15s ease;
-o-transition: color 0.15s ease;
transition: color 0.15s ease;
}
/**
* Catchall style for links that transition on background color.
*/
.astyle-background-color-transition {
-webkit-transition: background-color 0.15s ease;
-o-transition: background-color 0.15s ease;
transition: background-color 0.15s ease;
}
/**
* Catchall style for links that transition on opacity.
*/
.astyle-opacity-transition, body#page-pannz-2026-registration-payment #main-ctr .stripe-power, body#page-pannz-2025-registration-payment #main-ctr .stripe-power {
opacity: 1;
-webkit-transition: opacity 0.15s;
-o-transition: opacity 0.15s;
transition: opacity 0.15s;
}
.astyle-opacity-transition:hover, body#page-pannz-2026-registration-payment #main-ctr .stripe-power:hover, body#page-pannz-2025-registration-payment #main-ctr .stripe-power:hover, .astyle-opacity-transition:active, body#page-pannz-2026-registration-payment #main-ctr .stripe-power:active, body#page-pannz-2025-registration-payment #main-ctr .stripe-power:active {
opacity: 0.7 !important;
}
.astyle-light-opacity-transition {
opacity: 1;
-webkit-transition: opacity 0.15s;
-o-transition: opacity 0.15s;
transition: opacity 0.15s;
}
.astyle-light-opacity-transition:hover, .astyle-light-opacity-transition:active {
opacity: 0.85 !important;
}
/**
* A style to forcibly remove opacity transition.
*/
.astyle-remove-opacity-transition {
opacity: 1 !important;
-webkit-transition: unset !important;
-o-transition: unset !important;
transition: unset !important;
}
.astyle-remove-opacity-transition:hover, .astyle-remove-opacity-transition:active {
opacity: 1 !important;
}
/**
* Catchall style for scale transition on hover.
*/
.astyle-scale {
-webkit-transition: -webkit-transform 0.2s ease;
transition: -webkit-transform 0.2s ease;
-o-transition: transform 0.2s ease;
transition: transform 0.2s ease;
transition: transform 0.2s ease, -webkit-transform 0.2s ease;
}
.astyle-scale:hover:not(.no-zoom) {
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
/*
|--------------------------------------------------------------------------
| ICO links, with and without text
|--------------------------------------------------------------------------
*/
.astyle-ico {
cursor: pointer;
}
.astyle-ico-only {
line-height: 1;
}
.astyle-ico-only .text {
line-height: 0;
font-size: 0;
text-indent: -10000em;
}
.astyle-ico-only, .astyle-ico-only:link, .astyle-ico-only:visited, .astyle-ico-only:hover, .astyle-ico-only:active {
text-decoration: none !important;
}
/**
* .astyle-ico.white-black #fff/$clr-black
*/
.astyle-ico.white-black svg path, .astyle-ico.white-black:link svg path, .astyle-ico.white-black:visited svg path {
fill: #fff;
}
.astyle-ico.white-black:hover svg path, .astyle-ico.white-black:active svg path {
fill: #000;
}
/**
* .astyle-ico.grey-5-black $clr-grey-5/$clr-black
*/
.astyle-ico.grey-5-black svg path, .astyle-ico.grey-5-black:link svg path, .astyle-ico.grey-5-black:visited svg path {
fill: #999;
}
.astyle-ico.grey-5-black:hover svg path, .astyle-ico.grey-5-black:active svg path {
fill: #000;
}
/**
* .astyle-ico.grey-6-black $clr-grey-6/$clr-black
*/
.astyle-ico.grey-6-black svg path, .astyle-ico.grey-6-black:link svg path, .astyle-ico.grey-6-black:visited svg path {
fill: #6d6e71;
}
.astyle-ico.grey-6-black:hover svg path, .astyle-ico.grey-6-black:active svg path {
fill: #000;
}
/**
* dflt style clr-link-dflt-normal/none, clr-link-dflt-normal/underline
*/
a:not(.btn), a:not(.btn):link, a:not(.btn):visited {
color: #d8225e;
}
a:not(.btn):hover, a:not(.btn):active {
color: #d8225e;
}
/**
* astyle-noul - no underline! useful for non-standard links that
* are divs with all sorts of text in them...
*/
.astyle-noul, .astyle-noul:link, .astyle-noul:visited, .astyle-noul:hover, .astyle-noul:active {
cursor: pointer;
text-decoration: none !important;
}
/**
* astyle-faux-link-overlay
*/
.astyle-faux-link-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 2;
opacity: 0;
overflow: hidden;
text-indent: 200%;
white-space: nowrap;
background: transparent;
}
/**
* astyle-red clr-pink-1/none, clr-pink-1/underline
*/
.astyle-red, .astyle-red:link, .astyle-red:visited {
color: #da1c5c !important;
text-decoration: none;
cursor: pointer;
}
.astyle-red:hover, .astyle-red:active {
color: #da1c5c !important;
text-decoration: underline;
}
/**
* tag styles
*/
.astyle-tag-style1, .astyle-tag-style1:link, .astyle-tag-style1:visited {
color: #4d4d4d !important;
text-transform: uppercase;
text-decoration: none !important;
}
.astyle-tag-style1:hover, .astyle-tag-style1:active {
color: #fff !important;
background-color: #d8225e !important;
text-decoration: none !important;
}
.astyle-tag-style2, .astyle-tag-style2:link, .astyle-tag-style2:visited {
color: #4d4d4d !important;
text-transform: uppercase;
text-decoration: none !important;
}
.astyle-tag-style2:hover, .astyle-tag-style2:active {
color: #000 !important;
text-decoration: none !important;
}
/**
* astyle1 clr-hero-1/none, clr-hero-1/underline
*/
.astyle1, .astyle1:link, .astyle1:visited {
color: #d8225e !important;
text-decoration: none;
cursor: pointer;
}
.astyle1:hover, .astyle1:active {
color: #d8225e !important;
text-decoration: underline;
}
/**
* astyle2 $clr-black/none, $clr-black/none
*/
.astyle2, body.page-type-longform-story .frame.white-on-red a:not([data-gen]), .story-layout[data-layout-type=on-page] .frame.white-on-red a:not([data-gen]), .astyle2:link, .astyle2:visited {
color: #000 !important;
text-decoration: none;
cursor: pointer;
}
.astyle2:hover, body.page-type-longform-story .frame.white-on-red a:hover:not([data-gen]), .story-layout[data-layout-type=on-page] .frame.white-on-red a:hover:not([data-gen]), .astyle2:active, body.page-type-longform-story .frame.white-on-red a:active:not([data-gen]), .story-layout[data-layout-type=on-page] .frame.white-on-red a:active:not([data-gen]) {
color: #000 !important;
text-decoration: none;
}
/**
* astyle3 $clr-grey-4/none, $clr-grey-2/underline
*/
.astyle3, .astyle3:link, .astyle3:visited {
color: #a7a9ac !important;
text-decoration: none;
cursor: pointer;
}
.astyle3:hover, .astyle3:active {
color: #e6e6e6 !important;
text-decoration: underline;
}
/**
* astyle4 $clr-black/none, $clr-black/underline
*/
.astyle4, .astyle4:link, .astyle4:visited {
color: #000 !important;
text-decoration: none;
cursor: pointer;
}
.astyle4:hover, .astyle4:active {
color: #000 !important;
text-decoration: underline;
}
/**
* astyle5 light(hero-red)/none, hero-red/underline
*/
.astyle5, .astyle5:link, .astyle5:visited {
color: #e7427a !important;
text-decoration: none;
cursor: pointer;
}
.astyle5:hover, .astyle5:active {
color: #da1c5c !important;
text-decoration: underline;
}
/**
* astyle6 $clr-text-lighter/none, $clr-pink-1/underline
*/
.astyle6, .astyle6:link, .astyle6:visited {
color: gray !important;
text-decoration: none;
cursor: pointer;
}
.astyle6:hover, .astyle6:active {
color: #da1c5c !important;
text-decoration: underline;
}
/**
* astyle7 $clr-text-light/none, $clr-pink-1/underline
*/
.astyle7, .link-panel.style1 .inner ul a, .astyle7:link, .astyle7:visited {
color: #404040 !important;
text-decoration: none;
cursor: pointer;
}
.astyle7:hover, .link-panel.style1 .inner ul a:hover, .astyle7:active, .link-panel.style1 .inner ul a:active {
color: #da1c5c !important;
text-decoration: underline;
}
/**
* astyle8 #6d84b4/none, #6d84b4/underline
*/
.astyle8, .astyle8:link, .astyle8:visited {
color: #6d84b4 !important;
text-decoration: none;
cursor: pointer;
}
.astyle8:hover, .astyle8:active {
color: #6d84b4 !important;
text-decoration: underline;
}
/**
* astyle9 $clr-grey-2/none, $clr-grey-2/underline
*/
.astyle9, .astyle9:link, .astyle9:visited {
color: #e6e6e6 !important;
text-decoration: none;
cursor: pointer;
}
.astyle9:hover, .astyle9:active {
color: #e6e6e6 !important;
text-decoration: underline;
}
/**
* astyle10 $clr-green-black-7/none, $clr-green-black-7/underline
*/
.astyle10, .astyle10:link, .astyle10:visited {
color: #006f7f !important;
text-decoration: none;
cursor: pointer;
}
.astyle10:hover, .astyle10:active {
color: #006f7f !important;
text-decoration: underline;
}
/**
* astyle11 $clr-green-black-4/none, $clr-green-black-4/underline
*/
.astyle11, .astyle11:link, .astyle11:visited {
color: #005f71 !important;
text-decoration: none;
cursor: pointer;
}
.astyle11:hover, .astyle11:active {
color: #005f71 !important;
text-decoration: underline;
}
/**
* astyle12 $clr-green-black-9/none, $clr-green-black-9/none
*/
.astyle12, body.page-type-longform-story .frame.red-on-white a:not([data-gen]), .story-layout[data-layout-type=on-page] .frame.red-on-white a:not([data-gen]), .astyle12:link, .astyle12:visited {
color: #003443 !important;
text-decoration: none;
cursor: pointer;
}
.astyle12:hover, body.page-type-longform-story .frame.red-on-white a:hover:not([data-gen]), .story-layout[data-layout-type=on-page] .frame.red-on-white a:hover:not([data-gen]), .astyle12:active, body.page-type-longform-story .frame.red-on-white a:active:not([data-gen]), .story-layout[data-layout-type=on-page] .frame.red-on-white a:active:not([data-gen]) {
color: #003443 !important;
text-decoration: none;
}
/**
* astyle13 $clr-blue-1/none, $clr-blue-1/underline
*/
.astyle13, .astyle13:link, .astyle13:visited {
color: #00adef !important;
text-decoration: none;
cursor: pointer;
}
.astyle13:hover, .astyle13:active {
color: #00adef !important;
text-decoration: underline;
}
/**
* astyle14 $clr-grey-9/none, $clr-grey-9/underline
*/
.astyle14, .astyle14:link, .astyle14:visited {
color: #bcbec0 !important;
text-decoration: none;
cursor: pointer;
}
.astyle14:hover, .astyle14:active {
color: #bcbec0 !important;
text-decoration: underline;
}
/**
* astyle15 $clr-pink-1/none, $clr-pink-1/underline
*/
.astyle15, .astyle15:link, .astyle15:visited {
color: #da1c5c !important;
text-decoration: none;
cursor: pointer;
}
.astyle15:hover, .astyle15:active {
color: #da1c5c !important;
text-decoration: underline;
}
/**
* astyle16 $clr-green-black-7/none, $clr-green-black-7/underline
*/
.astyle16, .astyle16:link, .astyle16:visited {
color: #083034 !important;
text-decoration: none;
cursor: pointer;
}
.astyle16:hover, .astyle16:active {
color: #083034 !important;
text-decoration: underline;
}
/**
* astyle17 $clr-grey-1/none, $clr-grey-5/none
*/
.astyle17, .astyle17:link, .astyle17:visited {
color: #ebebeb !important;
text-decoration: none;
cursor: pointer;
}
.astyle17:hover, .astyle17:active {
color: #999 !important;
text-decoration: none;
}
/**
* astyle18 $clr-grey-1/none, $clr-grey-5/underline
*/
.astyle18, .astyle18:link, .astyle18:visited {
color: #ebebeb !important;
text-decoration: none;
cursor: pointer;
}
.astyle18:hover, .astyle18:active {
color: #999 !important;
text-decoration: underline;
}
/**
* astyle19 #fff/none, #fff/none
*/
.astyle19, .astyle19:link, .astyle19:visited {
color: #fff !important;
text-decoration: none;
cursor: pointer;
}
.astyle19:hover, .astyle19:active {
color: #fff !important;
text-decoration: none;
}
/**
* astyle20 $clr-link-astyle20-normal/none, $clr-link-astyle20-normal/none
*/
.astyle20, .astyle20:link, .astyle20:visited {
color: #f15a29 !important;
text-decoration: none;
cursor: pointer;
}
.astyle20:hover, .astyle20:active {
color: #f15a29 !important;
text-decoration: none;
}
/**
* astyle21 $clr-grey-1/none, $clr-black/underline
*/
.astyle21, .astyle21:link, .astyle21:visited {
color: #6c757d !important;
text-decoration: none;
cursor: pointer;
}
.astyle21:hover, .astyle21:active {
color: #000 !important;
text-decoration: underline;
}
/**
* astyle22 $clr-link-astyle22-normal/none, $clr-link-astyle22-normal/underline
*/
.astyle22, .astyle22:link, .astyle22:visited {
color: #f15a29 !important;
text-decoration: none;
cursor: pointer;
}
.astyle22:hover, .astyle22:active {
color: #f15a29 !important;
text-decoration: underline;
}
/**
* astyle23 #fff/none, #fff/underline
*/
.astyle23, .astyle23:link, .astyle23:visited {
color: #fff !important;
text-decoration: none;
cursor: pointer;
}
.astyle23:hover, .astyle23:active {
color: #fff !important;
text-decoration: underline;
}
/**
* astyle24 $gray-500/none, $clr-black/underline
*/
.astyle24, .astyle24:link, .astyle24:visited {
color: #adb5bd !important;
text-decoration: none;
cursor: pointer;
}
.astyle24:hover, .astyle24:active {
color: #000 !important;
text-decoration: underline;
}
/**
* astyle25 #4d4d4d/none, #4d4d4d/underline
*/
.astyle25, .astyle25:link, .astyle25:visited {
color: #4d4d4d !important;
text-decoration: none;
cursor: pointer;
}
.astyle25:hover, .astyle25:active {
color: #4d4d4d !important;
text-decoration: underline;
}
/**
* astyle26 #4d4d4d/none, $clr-black/underline
*/
.astyle26, .astyle26:link, .astyle26:visited {
color: #4d4d4d !important;
text-decoration: none;
cursor: pointer;
}
.astyle26:hover, .astyle26:active {
color: #000 !important;
text-decoration: underline;
}
/**
* astyle27 $clr-grey-7/none, $clr-black/none
*/
.astyle27, .astyle27:link, .astyle27:visited {
color: #4d4d4d !important;
text-decoration: none;
cursor: pointer;
}
.astyle27:hover, .astyle27:active {
color: #000 !important;
text-decoration: none;
}
/**
* astyle28 $clr-grey-6/none, $clr-black/none
*/
.astyle28, .astyle28:link, .astyle28:visited {
color: #6d6e71 !important;
text-decoration: none;
cursor: pointer;
}
.astyle28:hover, .astyle28:active {
color: #000 !important;
text-decoration: none;
}
/**
* astyle29 #fff/none, #fff/underline
*/
.astyle29, .astyle29:link, .astyle29:visited {
color: #fff !important;
text-decoration: none;
cursor: pointer;
}
.astyle29:hover, .astyle29:active {
color: #fff !important;
text-decoration: underline;
}
/**
* astyle30 fontawsm ico, $clr-black/none, $clr-hero-red/underline
*/
.astyle30, .astyle30:link, .astyle30:visited {
color: #000 !important;
text-decoration: none;
cursor: pointer;
}
.astyle30 svg.icon path, .astyle30:link svg.icon path, .astyle30:visited svg.icon path {
fill: #000;
}
.astyle30:hover, .astyle30:active {
color: #da1c5c !important;
text-decoration: underline;
}
.astyle30:hover svg.icon path, .astyle30:active svg.icon path {
fill: #da1c5c;
}
/**
* astyle31 fontawsm ico, $clr-black/none, $clr-hero-red/none
*/
.astyle31, .astyle31:link, .astyle31:visited {
color: #000 !important;
text-decoration: none;
cursor: pointer;
}
.astyle31 svg.icon path, .astyle31:link svg.icon path, .astyle31:visited svg.icon path {
fill: #000;
}
.astyle31:hover, .astyle31:active {
color: #da1c5c !important;
text-decoration: none;
}
.astyle31:hover svg.icon path, .astyle31:active svg.icon path {
fill: #da1c5c;
}
/**
* astyle32 $clr-grey-4/none, $clr-black/underline
*/
.astyle32, .astyle32:link, .astyle32:visited {
color: #a7a9ac !important;
text-decoration: none;
cursor: pointer;
}
.astyle32:hover, .astyle32:active {
color: #000 !important;
text-decoration: underline;
}
/**
* astyle33 $clr-grey-4/none, $clr-black/none
*/
.astyle33, .astyle33:link, .astyle33:visited {
color: #a7a9ac !important;
text-decoration: none;
cursor: pointer;
}
.astyle33:hover, .astyle33:active {
color: #000 !important;
text-decoration: none;
}
/**
* astyle34 $clr-grey-5/none, $clr-black/underline
*/
.astyle34, .astyle34:link, .astyle34:visited {
color: #999 !important;
text-decoration: none;
cursor: pointer;
}
.astyle34:hover, .astyle34:active {
color: #000 !important;
text-decoration: underline;
}
/**
* astyle35 $clr-grey-4/none, $clr-black/none
*/
.astyle35, .astyle35:link, .astyle35:visited {
color: #999 !important;
text-decoration: none;
cursor: pointer;
}
.astyle35:hover, .astyle35:active {
color: #000 !important;
text-decoration: none;
}
/**
* astyle36 #fff/none, $clr-black/none
*/
.astyle36, .astyle36:link, .astyle36:visited {
color: #fff !important;
text-decoration: none;
cursor: pointer;
}
.astyle36:hover, .astyle36:active {
color: #000 !important;
text-decoration: none;
}
/**
* astyle37 tint($clr-hero-pink-1, 10%)/none, $clr-hero-pink-1/underline
*/
.astyle37, .astyle37:link, .astyle37:visited {
color: #efa7bf !important;
text-decoration: none;
cursor: pointer;
}
.astyle37:hover, .astyle37:active {
color: #d8225e !important;
text-decoration: underline;
}
/**
* astyle38 tint($clr-hero-pink-1, 10%)/none, $clr-black/underline
*/
.astyle38, .astyle38:link, .astyle38:visited {
color: #efa7bf !important;
text-decoration: none;
cursor: pointer;
}
.astyle38:hover, .astyle38:active {
color: #000 !important;
text-decoration: underline;
}
/**
* astyle39 $clr-black on white background
*/
.astyle39, .astyle39:link, .astyle39:visited {
display: inline-block;
font-family: FranklinGothicURW-Med;
line-height: 1;
font-size: 1rem;
padding: 6px 7px 4px;
color: #000 !important;
background-color: #fff !important;
text-decoration: none !important;
text-transform: uppercase;
cursor: pointer;
}
.astyle39.sm, .astyle39:link.sm, .astyle39:visited.sm {
font-size: 0.875rem;
padding: 6px 7px 4px;
}
.astyle39.lg, .astyle39:link.lg, .astyle39:visited.lg {
font-size: 1.125rem;
padding: 6px 7px 4px;
}
.astyle39:hover, .astyle39:active {
text-decoration: none !important;
}
/**
* astyle40 fontawsm ico, $clr-black/none, $clr-pink-1/none
*/
.astyle40, .astyle40:link, .astyle40:visited {
color: #000 !important;
text-decoration: none;
cursor: pointer;
}
.astyle40 svg.icon path, .astyle40:link svg.icon path, .astyle40:visited svg.icon path {
fill: #000;
}
.astyle40:hover, .astyle40:active {
color: #da1c5c !important;
text-decoration: none;
}
.astyle40:hover svg.icon path, .astyle40:active svg.icon path {
fill: #da1c5c;
}
/**
* astyle41 darken(hero-pink)/none, darken(hero-pink)/underline
*/
.astyle41, .astyle41:link, .astyle41:visited {
color: #801036 !important;
text-decoration: none;
cursor: pointer;
}
.astyle41:hover, .astyle41:active {
color: #801036 !important;
text-decoration: underline;
}
/**
* astyle42 black/bold/none, black/bold/underline
*/
.astyle42, .platform-notif .msg a, .astyle42:link, .astyle42:visited {
color: #000 !important;
font-weight: bold;
text-decoration: none;
cursor: pointer;
}
.astyle42:hover, .platform-notif .msg a:hover, .astyle42:active, .platform-notif .msg a:active {
color: #000 !important;
font-weight: bold;
text-decoration: underline;
}
/**
* astyle43 $clr-grey-5/none, $clr-black/none
*/
.astyle43, .astyle43:link, .astyle43:visited {
color: #999 !important;
text-decoration: none;
cursor: pointer;
}
.astyle43:hover, .astyle43:active {
color: #000 !important;
text-decoration: none;
}
/**
* astyle44 $clr-grey-7/none, $clr-black/none, uppercase, bold
*/
.astyle44, .astyle44:link, .astyle44:visited {
color: #4d4d4d !important;
text-decoration: none;
cursor: pointer;
text-transform: uppercase;
font-weight: bold;
}
.astyle44:hover, .astyle44:active {
color: #000 !important;
text-decoration: none;
}
/**
* astyle-eventbrite-1 #fd8224/none, #fd8224/none
*/
.astyle-eventbrite-1, .astyle-eventbrite-1:link, .astyle-eventbrite-1:visited {
color: #fd8224 !important;
text-decoration: none;
cursor: pointer;
}
.astyle-eventbrite-1:hover, .astyle-eventbrite-1:active {
color: #fd8224 !important;
text-decoration: none;
}
/**
* astyle-event-1 tint($clr-event, 65%)/none, $clr-event/underline
*/
.astyle-event-1, .astyle-event-1:link, .astyle-event-1:visited {
color: #e9b089 !important;
text-decoration: none;
cursor: pointer;
}
.astyle-event-1:hover, .astyle-event-1:active {
color: #dd8549 !important;
text-decoration: underline;
}
/**
* astyle-event-2 $clr-event/none, $clr-event/underline
*/
.astyle-event-2, .astyle-event-2:link, .astyle-event-2:visited {
color: #dd8549 !important;
text-decoration: none;
cursor: pointer;
}
.astyle-event-2:hover, .astyle-event-2:active {
color: #dd8549 !important;
text-decoration: underline;
}
/**
* astyle-groups-1 tint($clr-groups, 65%)/none, $clr-groups/underline
*/
.astyle-group-1, .astyle-group-1:link, .astyle-group-1:visited {
color: #a3ddab !important;
text-decoration: none;
cursor: pointer;
}
.astyle-group-1:hover, .astyle-group-1:active {
color: #71ca7e !important;
text-decoration: underline;
}
/**
* astyle-group-2 $clr-group/none, $clr-group/underline
*/
.astyle-group-2, .astyle-group-2:link, .astyle-group-2:visited {
color: #71ca7e !important;
text-decoration: none;
cursor: pointer;
}
.astyle-group-2:hover, .astyle-group-2:active {
color: #71ca7e !important;
text-decoration: underline;
}
/**
* astyle-actions-1 tint($clr-actions, 65%)/none, $clr-actions/underline
*/
.astyle-action-1, .astyle-action-1:link, .astyle-action-1:visited {
color: #6b8d9c !important;
text-decoration: none;
cursor: pointer;
}
.astyle-action-1:hover, .astyle-action-1:active {
color: #1b5066 !important;
text-decoration: underline;
}
/**
* astyle-action-2 $clr-action/none, $clr-action/underline
*/
.astyle-action-2, .astyle-action-2:link, .astyle-action-2:visited {
color: #1b5066 !important;
text-decoration: none;
cursor: pointer;
}
.astyle-action-2:hover, .astyle-action-2:active {
color: #1b5066 !important;
text-decoration: underline;
}
/**
* astyle-users-1 tint($clr-users, 65%)/none, $clr-users/underline
*/
.astyle-user-1, .astyle-user-1:link, .astyle-user-1:visited {
color: #737691 !important;
text-decoration: none;
cursor: pointer;
}
.astyle-user-1:hover, .astyle-user-1:active {
color: #282c55 !important;
text-decoration: underline;
}
/**
* astyle-user-2 $clr-user/none, $clr-user/underline
*/
.astyle-user-2, .astyle-user-2:link, .astyle-user-2:visited {
color: #282c55 !important;
text-decoration: none;
cursor: pointer;
}
.astyle-user-2:hover, .astyle-user-2:active {
color: #282c55 !important;
text-decoration: underline;
}
/**
* define all the sub-elements of our sprite sheet
*/
.graphic {
background-image: url("/images/white_labels/artsfront/artsfront-sprite.png?3116e8fa0d");
background-color: transparent;
display: inline-block;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.graphic {
background-image: url("/images/white_labels/artsfront/artsfront-sprite@2x.png?9ff7b73b30");
background-size: 1000px 1000px;
}
}
.graphic.header {
width: 100%;
height: 150px;
background-position: 0 -800px;
background-repeat: repeat;
}
.graphic.header-end {
width: 339px;
height: 250px;
background-position: -600px 0;
background-repeat: repeat;
}
.graphic.logo {
width: 467px;
height: 300px;
background-position: 0 0;
}
.graphic.twitter {
background-position: -80px -540px;
width: 51px;
height: 51px;
}
.graphic.twitter:hover {
background-position: -140px -540px;
}
.graphic.heart {
width: 16px;
height: 15px;
display: inline-block;
}
.graphic.heart.off {
background-position: 0 -500px;
}
.graphic.heart.on {
background-position: -50px -500px;
}
.graphic.follow, .graphic.join {
width: 20px;
height: 13px;
display: inline-block;
}
.graphic.follow.off, .graphic.join.off {
background-position: -80px -700px;
}
.graphic.follow.on, .graphic.join.on {
background-position: -140px -700px;
}
.graphic.email {
width: 50px;
height: 50px;
background-position: 0 -650px;
}
.graphic.register {
width: 50px;
height: 50px;
background-position: 0 -600px;
}
.graphic.arrow-down-45 {
width: 27px;
height: 27px;
background-position: 0 -700px;
}
.graphic.arrow-right-16p {
width: 16px;
height: 16px;
background-position: -200px -700px;
}
.graphic.arrow-down-16p {
width: 16px;
height: 16px;
background-position: -180px -700px;
}
.graphic.placestories-logo {
width: 150px;
height: 20px;
background-position: -240px -540px;
display: inline-block;
}
.graphic.share {
width: 51px;
height: 51px;
background-position: -80px -600px;
}
.graphic.share:hover {
background-position: -140px -600px;
}
.graphic.share-fb {
width: 24px;
height: 24px;
background-position: -200px -540px;
display: inline-block;
}
.graphic.share-t {
width: 24px;
height: 24px;
background-position: -200px -580px;
display: inline-block;
}
.graphic.share-g {
width: 24px;
height: 24px;
background-position: -200px -620px;
display: inline-block;
}
.graphic.social-facebook {
width: 26px;
height: 26px;
background-position: -250px -700px;
display: inline-block;
}
.graphic.social-ps-profile {
width: 26px;
height: 26px;
background-position: -350px -700px;
display: inline-block;
}
.graphic.social-twitter {
width: 26px;
height: 26px;
background-position: -300px -700px;
display: inline-block;
}
.graphic.social-youtube {
width: 64px;
height: 26px;
background-position: -400px -700px;
display: inline-block;
}
.graphic.social-vimeo {
width: 26px;
height: 26px;
background-position: -475px -700px;
display: inline-block;
}
.graphic.social-gplus {
width: 26px;
height: 26px;
background-position: -525px -700px;
display: inline-block;
}
.graphic.social-flickr {
width: 26px;
height: 26px;
background-position: -575px -700px;
display: inline-block;
}
.graphic.social-instagram {
width: 26px;
height: 26px;
background-position: -625px -700px;
display: inline-block;
}
.graphic.social-pinterest {
width: 26px;
height: 26px;
background-position: -675px -700px;
display: inline-block;
}
.graphic.social-skype {
width: 26px;
height: 26px;
background-position: -725px -700px;
display: inline-block;
}
.graphic.social-soundcloud {
width: 56px;
height: 26px;
background-position: -775px -700px;
display: inline-block;
}
.graphic.social-linkedin {
width: 26px;
height: 26px;
background-position: -850px -700px;
display: inline-block;
}
.graphic.social-blog {
width: 26px;
height: 26px;
background-position: -900px -700px;
display: inline-block;
}
.graphic.like-large {
width: 25px;
height: 24px;
background-position: 0 -450px;
}
.graphic.like-large.sel, .custom-select .main-area:hover .graphic.like-large.arrow, .custom-select .main-area.active .graphic.like-large.arrow, .graphic.like-large:hover {
background-position: -50px -450px;
}
.graphic.folder {
width: 48px;
height: 44px;
background-position: -600px -300px;
}
.graphic.folder.facebook {
width: 48px;
height: 44px;
background-position: -600px -350px;
}
.graphic.folder.flickr {
width: 48px;
height: 44px;
background-position: -600px -400px;
}
.graphic.folder.youtube {
width: 48px;
height: 44px;
background-position: -600px -450px;
}
.graphic.folder.vimeo {
width: 48px;
height: 44px;
background-position: -600px -500px;
}
.graphic.folder.soundcloud {
width: 48px;
height: 44px;
background-position: -600px -550px;
}
.graphic.folder.instagram {
width: 48px;
height: 44px;
background-position: -600px -600px;
}
.graphic.folder.pinterest {
width: 48px;
height: 44px;
background-position: -600px -650px;
}
.graphic.doc {
width: 40px;
height: 44px;
background-position: -700px -300px;
}
.graphic.doc.pdf, .graphic.doc-pdf-med {
width: 40px;
height: 44px;
background-position: -700px -350px;
}
.graphic.doc.docx, .graphic.doc-docx-med {
width: 40px;
height: 44px;
background-position: -700px -400px;
}
.graphic.doc.excel, .graphic.doc-xlsx-med {
width: 40px;
height: 44px;
background-position: -700px -450px;
}
a.graphic span {
position: absolute;
left: -999999px;
}
/**
* Standard form styles.
*/
.form-blurb {
font-size: 1rem;
line-height: 1.25;
margin-bottom: 1.5rem;
}
#form-ctr.form-label-sml label, .form-ctr.form-label-sml label {
font-size: 1rem !important;
}
.form-descrip {
margin-bottom: 1rem;
}
.form-descrip ul {
padding-left: 1.5rem;
list-style: initial;
}
.form-descrip ul li {
list-style-type: disc;
}
form label {
font-size: 1.125rem;
font-weight: bold;
color: #083034;
margin-bottom: 0;
}
form label.error {
color: #cd2027;
}
form .form-admin-only-hide {
display: none;
}
form .form-admin-only {
padding: 1rem;
background-color: #f5f5f5;
border-radius: 2px;
}
form .form-label-normal,
form .form-check-label,
form .form-radio-label-normal {
font-size: 1rem;
font-weight: normal;
}
form .form-radio-label-normal {
margin-right: 0.4rem;
}
form .form-radio-indented-ctr {
margin-bottom: 6px;
display: grid;
grid-template-columns: auto 1fr;
-webkit-box-align: start;
-webkit-align-items: start;
-ms-flex-align: start;
align-items: start;
-webkit-column-gap: 12px;
-moz-column-gap: 12px;
column-gap: 12px;
}
form .form-radio-indented-ctr:last-child {
margin-bottom: 0;
}
form .form-radio-indented-ctr > input {
margin-top: 6px;
}
form .form-label-sm, form .form-label-sml {
font-size: 1rem;
}
form .form-label-xs {
font-size: 0.875rem;
}
form .form-hint {
font-size: 0.9375rem;
color: #6d6e71;
line-height: 1.25;
}
form .form-hint, form .form-hint p:last-child {
margin-bottom: 0.5rem;
}
form .form-hint.form-hint-xs {
font-size: 0.8125rem;
}
form .form-hint.form-hint-xs, form .form-hint.form-hint-xs p:last-child {
margin-bottom: 0.35rem;
}
form .form-error {
font-size: 1rem;
font-weight: bold;
color: #cd2027;
line-height: 1.25;
margin: 0.75rem 0;
}
form .form-error.form-error-xs {
font-size: 0.8125rem;
margin-bottom: 0.5rem;
}
form input[type=email], form input[type=password], form input[type=text], form textarea {
margin-bottom: 0.5rem;
}
form input[type=email].form-control-sm, form input[type=password].form-control-sm, form input[type=text].form-control-sm, form textarea.form-control-sm {
font-size: 0.875rem;
padding: 2px 5px;
}
form input[type=email].form-control-xs, form input[type=password].form-control-xs, form input[type=text].form-control-xs, form textarea.form-control-xs {
font-size: 0.75rem;
padding: 1px 3px;
}
form input[type=checkbox] {
margin-bottom: 0.3rem;
}
form .form-check-inline input[type=checkbox] {
margin-bottom: 0;
}
form .form-control {
color: #000;
}
form input::-webkit-input-placeholder, form textarea::-webkit-input-placeholder {
color: #aaa !important;
}
form input::-moz-placeholder, form textarea::-moz-placeholder {
color: #aaa !important;
}
form input:-ms-input-placeholder, form textarea:-ms-input-placeholder {
color: #aaa !important;
}
form input::-ms-input-placeholder, form textarea::-ms-input-placeholder {
color: #aaa !important;
}
form input::placeholder, form textarea::placeholder {
color: #aaa !important;
}
form textarea:not([data-expandable]) {
height: 8rem;
}
form textarea[data-expandable] {
line-height: 1.2;
}
form .form-group {
margin-bottom: 1.25rem;
}
form .form-group.superusers-only {
padding: 0.5rem 1rem;
background-color: #f0f0f0;
border-radius: 3px;
}
form .form-group.mini {
margin-bottom: 1rem;
}
form .form-group.xmini {
margin-bottom: 0.5rem;
}
form .form-group.xxmini {
margin-bottom: 0;
}
form .form-group.push-down {
padding-top: 1rem;
}
form .form-group .form-group-title {
font-size: 1.125rem;
font-weight: bold;
color: #083034;
margin-bottom: 0.5rem;
}
form .form-group.section-heading .form-group-title {
font-size: 1.3125rem;
border-bottom: 2px solid #000;
padding-bottom: 5px;
letter-spacing: 1.5px;
}
form .form-group.section-heading.no-underline .form-group-title {
border-bottom: none;
}
form .form-group .form-group-subtitle {
font-size: 0.9375rem;
font-weight: bold;
color: #000;
margin-bottom: 0.4rem;
}
form .form-group .form-group-descrip {
font-size: 1rem;
color: #000;
margin-bottom: 0.5rem;
}
form .form-group .form-group-descrip.tight {
margin-bottom: -0.5rem;
}
form .form-group .form-group-descrip ul {
padding-left: 1.5rem;
list-style: initial;
}
form .form-group .form-group-descrip ul li {
list-style-type: disc;
}
form .form-group.no-fields .form-group-descrip {
font-size: 1rem;
}
form .form-group.titled label {
font-weight: normal;
}
form .form-group .form-group-title.has-error, form .form-group .form-group-subtitle.has-error, form .form-group label.has-error {
color: #cd2027;
}
form .form-group.multi > .inner {
margin-left: 1rem;
margin-bottom: 1rem;
}
form .form-group.multi label {
font-size: 1rem;
}
form .form-group.form-group-sm {
margin-bottom: 0.5rem;
}
form .form-group.form-group-sm .form-group-title {
font-size: 0.9375rem;
margin-bottom: 0.2rem;
}
form .form-group-break {
margin-bottom: 1.5rem;
}
form .form-subgroup {
margin-left: 1rem;
}
form .form-actions {
margin-top: 2rem;
}
form .form-actions > * {
display: inline-block;
margin-right: 0.75rem;
}
form .form-actions > a:not(.btn) {
position: relative;
top: 2px;
}
form .form-group.has-error, form .form-group.has-error-in-part,
form .form-logical-group.has-error, form .form-logical-group.has-error-in-part {
padding: 1rem;
background-color: #f0f0f0;
}
form .form-group.has-error:not(.multi) label:not(.form-check-label) {
color: #cd2027;
}
form .form-group.has-error:not(.multi) input.form-control[type=text], form .form-group.has-error:not(.multi) input.form-control[type=email], form .form-group.has-error:not(.multi) textarea.form-control, form .form-group.has-error:not(.multi) select.form-control {
border-color: #cd2027;
border-width: 2px;
}
form label.has-error:not(.form-check-label) {
color: #cd2027;
}
form input.has-error.form-control[type=text],
form input.has-error.form-control[type=email],
form textarea.has-error.form-control,
form select.has-error.form-control {
border-color: #cd2027;
border-width: 2px;
}
form .error-help-block {
color: #cd2027;
margin: 0.5rem 0 1rem;
font-size: 0.875rem;
}
form .warning {
margin-bottom: 1rem;
}
form .social {
vertical-align: -7px;
margin: 0.5rem 0.25rem 0 0;
}
form .twitter-typeahead {
width: 100%;
}
form .sec-text-field.multi-checkbox, form .sec-text-field.multi-radio2 {
display: none;
}
.form-check.form-check-tight > input {
margin-right: 0;
}
#form-ctr .form-checkbox-groups .grp-title {
font-size: 0.9375rem;
font-weight: bold;
margin: 1.5rem 0 -0.5rem;
}
#form-ctr .form-checkbox-groups .group:not(:first-child) {
margin-top: 1rem;
}
#form-ctr .form-checkbox-groups .group .form-check .form-check-label {
font-size: 0.875rem !important;
line-height: 1.2;
}
#form-ctr .form-checkbox-groups .group > .sep {
font-size: 0.8125rem;
margin-left: 4px;
}
#form-ctr .form-checkbox-groups.sm .group .form-check .form-check-label {
font-size: 0.875rem !important;
}
#form-ctr .form-checkbox-groups.sm .group > .sep {
font-size: 0.8125rem;
}
.form-step {
display: inline-block;
color: #fff;
font-size: 0.9375rem;
font-weight: bold;
background-color: #d8225e;
line-height: 1.5rem;
height: 1.75rem;
width: 1.75rem;
border-radius: 100%;
margin: 0 0.3rem 0.5rem 0;
text-align: center;
}
form.hide-steps .form-step {
display: none;
}
/**
*