/* HELPER CLASSES *************************************************************/
.br { display: block; }
.clear { clear: both; }

/* floating blocks */
.left { float: left; }
.right { float: right; }

/* two columns fluid (the 1st child must have a fixed width, the 2nd element fits the remaining space) */
[class*="dual-fluid-cols-left"] > *:first-child {
    float: left;
}
[class*="dual-fluid-cols-right"] > *:first-child {
    float: right;
}
[class*="dual-fluid-cols-left"] > *:first-child + *,
[class*="dual-fluid-cols-right"]  > *:first-child + * {
    overflow: hidden;
    width: auto;
}

/* two columns fluid (the 1st child must have a fixed width, the 2nd element fits the remaining space) */
[class*="dual-cells"] {
    display: table;
}
[class*="dual-cells"] > * {
    display: table-cell;
}


/* displays */
.inline-block { display: inline-block !important; }
.inline { display: inline !important; }
.table { display: table !important; }
.table > *,
.table > * > * { vertical-align: middle !important; }
.table-row { display: table-row !important; }
.table-cell { display: table-cell !important; }

/* ie9 and lesser or others */
.modern-only,
.modern-only {
	display: block!important;
}
.ie9 .modern-only,
.lt-ie9 .modern-only {
	display: none!important;
}
.old-only,
.old-only {
	display: none!important;
}
.ie9 .old-only,
.lt-ie9 .old-only {
	display: block!important;
}

.clean-list {
	list-style: none;
	padding: 0px;
	margin: 0px;
}

/* positions */
.absolute { position: absolute !important; }
.relative { position: relative !important; }

/* font styles */
.normal { font-style: normal !important; }
.italic { font-style: italic !important; }
.strike { text-decoration: line-through !important; }
.no-line { text-decoration: none !important; }
.underline { text-decoration: underline !important; }
.underline-hover:hover { text-decoration: underline !important; }

/* font weights */
.light { font-weight: 300 !important; }
.regular { font-weight: 400 !important; }
b,
strong,
.strong,
.bold { font-weight: 600 !important; }
.xbold,
.xstrong { font-weight: 700 !important; }

/* font sizes */
.xxs-font { font-size: 0.571em !important; }
.xs-font { font-size: 0.714em !important; }
.s-font { font-size: 0.857em !important; }
.default-font { font-size: 1em !important; }
.m-font { font-size: 1.143em !important; }
.l-font { font-size: 1.286em !important; }
.xl-font { font-size: 1.5em !important; }
.xxl-font { font-size: 1.714em !important; }

/* upper/lower case */
.uc { text-transform: uppercase !important; }
.lc { text-transform: lowercase !important; }

/* ucfirst */
.ucfirst:first-letter {	text-transform: uppercase; }


/* background colors */
.grey-gradient-bg {
    background: -moz-linear-gradient(top, #ffffff 0%, #999999 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#999999));
    background: -webkit-linear-gradient(top, #ffffff 0%,#999999 100%);
    background: -o-linear-gradient(top, #ffffff 0%,#999999 100%);
    background: -ms-linear-gradient(top, #ffffff 0%,#999999 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#999999 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#999999',GradientType=0 );
}
.light-grey-bg { background-color: #f5f5f5 !important; }
.med-grey-bg { background-color: #777 }
.white-bg { background-color: #fff !important; }
.transp-bg { background-color: transparent !important; }
/* colors */
.white { color: #fff !important; }
.black { color: #000 !important; }
.dark-grey { color: #333 !important; }
.grey { color: #999 !important; }
.blue-green { color: #00AF99 !important; }

/* borders */
.borders { border: 1px solid !important; }
.bborder { border-bottom: 1px solid !important; }
.lborder { border-left: 1px solid !important; }
.rborder { border-right: 1px solid !important; }
.tborder { border-top: 1px solid !important; }

.no-borders { border: none !important; }
.no-bborder { border-bottom: none !important; }
.no-lborder { border-left: none !important; }
.no-rborder { border-right: none !important; }
.no-tborder { border-top: none !important; }

.grey-border { border-color: #dadada !important; }

/* filters */
.greyscale {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
    transition: 200ms linear;
}

/* cursors */
.pointer {
    cursor: pointer;
}

/* alignment */
.abscenter {
    bottom: 0;
    left: 0;
    margin: auto;
    right: 0;
    top: 0;
}

.hcenter {
    margin-left: auto !important;
    margin-right: auto !important;
}

.vcenter {
    display: inline-block;
    line-height: 1.2;
    vertical-align: middle;
}
.vtop { vertical-align: top !important; }
.vmiddle { vertical-align: middle !important; }
.vbottom { vertical-align: bottom !important; }

.txtcenter { text-align: center !important; }
.txtleft { text-align: left !important; }
.txtright { text-align: right !important; }
.txtjustify { text-align: justify !important; }

.txtdanger { color: #a94442; }
.txtsuccess { color: #42a944; }
.txtdefault { color: black; }

.no-placeholder {
	display: none;
	color: #666;
}
.ie9 .no-placeholder,
.lt-ie9 .no-placeholder { display: block; }

/* spacing */
.m-reset, .ma0 { margin: 0 !important; }
.p-reset, .pa0 { padding: 0 !important; }
.ma1, .mas { margin: 10px !important; }
.ma2, .mam { margin: 20px !important; }
.ma3, .mal { margin: 30px !important; }
.ma5, .maxxl { margin: 50px !important; }
.paxs { padding: 5px !important; }
.pa1, .pas { padding: 10px !important; }
.pa2, .pam { padding: 20px !important; }
.pa3, .pal { padding: 30px !important; }

.mt0, .mtn { margin-top: 0 !important; }
.mtxs { margin-top: 5px !important; }
.mt1, .mts { margin-top: 10px !important; }
.mtxm { margin-top: 15px !important; }
.mt2, .mtm { margin-top: 20px !important; }
.mt3, .mtl { margin-top: 30px !important; }
.mt4, .mtxl { margin-top: 40px !important; }
.mt5, .mtxxl { margin-top: 50px !important; }
.mr0, .mrn { margin-right: 0 !important; }
.mrxs { margin-right: 5px !important; }
.mr1, .mrs { margin-right: 10px !important; }
.mr2, .mrm { margin-right: 20px !important; }
.mr3, .mrl { margin-right: 30px !important; }
.mr4, .mrxl { margin-right: 40px !important; }
.mb0, .mbn { margin-bottom: 0 !important; }
.mbxs { margin-bottom: 5px !important; }
.mb1, .mbs { margin-bottom: 10px !important; }
.mb2, .mbm { margin-bottom: 20px !important; }
.mb3, .mbl { margin-bottom: 30px !important; }
.mb4, .mbxl { margin-bottom: 40px !important; }
.ml0, .mln { margin-left: 0 !important; }
.mlxs { margin-left: 5px !important; }
.ml1, .mls { margin-left: 10px !important; }
.ml2, .mlm { margin-left: 20px !important; }
.ml3, .mll { margin-left: 30px !important; }
.ml4, .mlxl { margin-left: 40px !important; }
.mh0, .mhn {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.mh1, .mhs {
    margin-left: 10px !important;
    margin-right: 10px !important;
}
.mh2, .mhm {
    margin-left: 20px !important;
    margin-right: 20px !important;
}
.mh3, .mhl {
    margin-left: 30px !important;
    margin-right: 30px !important;
}
.mh4, .mhxl {
    margin-left: 40px !important;
    margin-right: 40px !important;
}
.mv0, .mvn {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}
.mv1, .mvs {
    margin-bottom: 10px !important;
    margin-top: 10px !important;
}
.mvxm {
    margin-bottom: 15px !important;
    margin-top: 15px !important;
}
.mv2, .mvm {
    margin-bottom: 20px !important;
    margin-top: 20px !important;
}
.mv3, .mvl {
    margin-bottom: 30px !important;
    margin-top: 30px !important;
}
.mv4, .mvxl {
    margin-bottom: 40px !important;
    margin-top: 40px !important;
}

.pt0, .ptn { padding-top: 0 !important; }
.pt1, .pts { padding-top: 10px !important; }
.pt2, .ptm { padding-top: 20px !important; }
.pt3, .ptl { padding-top: 30px !important; }
.pt4, .ptxl { padding-top: 40px !important; }
.pt6 { padding-top: 60px !important; }
.pt7 { padding-top: 70px !important; }
.pt10 { padding-top: 100px !important; }
.pr0, .prn { padding-right: 0 !important; }
.pr1, .prs { padding-right: 10px !important; }
.pr2, .prm { padding-right: 20px !important; }
.pr3, .prl { padding-right: 30px !important; }
.pr4, .prxl { padding-right: 40px !important; }
.pb0, .pbn { padding-bottom: 0 !important; }
.pb1, .pbs { padding-bottom: 10px !important; }
.pb2, .pbm { padding-bottom: 20px !important; }
.pb3, .pbl { padding-bottom: 30px !important; }
.pb4, .pbxl { padding-bottom: 40px !important; }
.pb6 { padding-bottom: 60px !important; }
.pb7 { padding-bottom: 70px !important; }
.pl0, .pln { padding-left: 0 !important; }
.pl1, .pls { padding-left: 10px !important; }
.pl2, .plm { padding-left: 20px !important; }
.pl3, .pll { padding-left: 30px !important; }
.pl4, .plxl { padding-left: 40px !important; }
.pl5, .plxxl { padding-left: 50px !important; }
.ph0, .phn {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.ph1, .phs {
    padding-left: 10px !important;
    padding-right: 10px !important;
}
.ph2, .phm {
    padding-left: 20px !important;
    padding-right: 20px !important;
}
.ph3, .phl {
    padding-left: 30px !important;
    padding-right: 30px !important;
}
.ph4, .phxl {
    padding-left: 40px !important;
    padding-right: 40px !important;
}
.pv0, .pvn {
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}
.pvxs {
    padding-bottom: 5px !important;
    padding-top: 5px !important;
}
.pv1, .pvs {
    padding-bottom: 10px !important;
    padding-top: 10px !important;
}
.pv2, .pvm {
    padding-bottom: 20px !important;
    padding-top: 20px !important;
}
.pv3, .pvl {
    padding-bottom: 30px !important;
    padding-top: 30px !important;
}
.pv4, .pvxl {
    padding-bottom: 40px !important;
    padding-top: 40px !important;
}

/* widths */
.w10    { width: 10% !important; }
.w20    { width: 20% !important; }
.w25    { width: 25% !important; }
.w30    { width: 30% !important; }
.w33    { width: 33.3333% !important; }
.w40    { width: 40% !important; }
.w45    { width: 45% !important; }
.w50    { width: 50% !important; }
.w60    { width: 60% !important; }
.w66    { width: 66.6666% !important; }
.w70    { width: 70% !important; }
.w75    { width: 75% !important; }
.w80    { width: 80% !important; }
.w90    { width: 90% !important; }
.w100   { width: 100% !important; }
.wauto  { width: auto !important; }

.w50p   { width: 50px !important; }
.w100p  { width: 100px !important; }
.w150p  { width: 150px !important; }
.w200p  { width: 200px !important; }
.w250p  { width: 250px !important; }
.w300p  { width: 300px !important; }
.w400p  { width: 400px !important; }
.w500p  { width: 500px !important; }
.w600p  { width: 600px !important; }
.w700p  { width: 700px !important; }
.w800p  { width: 800px !important; }
.w900p  { width: 900px !important; }
.w1000p  { width: 1000px !important; }

/* heights */
.h10    { height: 10% !important; }
.h20    { height: 20% !important; }
.h25    { height: 25% !important; }
.h30    { height: 30% !important; }
.h33    { height: 33.3333% !important; }
.h40    { height: 40% !important; }
.h45    { height: 45% !important; }
.h50    { height: 50% !important; }
.h60    { height: 60% !important; }
.h66    { height: 66.6666% !important; }
.h70    { height: 70% !important; }
.h75    { height: 75% !important; }
.h80    { height: 80% !important; }
.h90    { height: 90% !important; }
.h100   { height: 100% !important; }

.h50p   { height: 50px !important; }
.h100p  { height: 100px !important; }
.h200p  { height: 200px !important; }
.h300p  { height: 300px !important; }
.h400p  { height: 400px !important; }
.h500p  { height: 500px !important; }
.h600p  { height: 600px !important; }
.h700p  { height: 700px !important; }
.h800p  { height: 800px !important; }
.h900p  { height: 900px !important; }
.h1000p  { height: 1000px !important; }

/* line-heights (- 4px to cancel out) */
.lh20p   { line-height: 20px !important; }
.lh30p   { line-height: 26px !important; }
.lh50p   { line-height: 46px !important; }
.lh100p  { line-height: 96px !important; }
.lh110p  { line-height: 106px !important; }
.lh150p  { line-height: 146px !important; }
.lh200p  { line-height: 196px !important; }
.lh300p  { line-height: 296px !important; }
.lh400p  { line-height: 396px !important; }
.lh500p  { line-height: 496px !important; }
.lh600p  { line-height: 596px !important; }
.lh700p  { line-height: 696px !important; }
.lh800p  { line-height: 796px !important; }
.lh900p  { line-height: 896px !important; }
.lh1000p  { line-height: 996px !important; }

.lh0 { line-height: 0 !important; }
.lh1 { line-height: 1 !important; }
.lh-dflt { line-height: 1.4 !important; }

/* max widths & height for responsive images */
.mw10    { max-width: 10% !important; }
.mw20    { max-width: 20% !important; }
.mw25    { max-width: 25% !important; }
.mw30    { max-width: 30% !important; }
.mw33    { max-width: 33.3333% !important; }
.mw40    { max-width: 40% !important; }
.mw45    { max-width: 45% !important; }
.mw50    { max-width: 50% !important; }
.mw55    { max-width: 55% !important; }
.mw60    { max-width: 60% !important; }
.mw66    { max-width: 66.6666% !important; }
.mw70    { max-width: 70% !important; }
.mw75    { max-width: 75% !important; }
.mw80    { max-width: 80% !important; }
.mw90    { max-width: 90% !important; }
.mw100   { max-width: 100% !important; }

.mw50p   { max-width: 50px !important; }
.mw150p  { max-width: 100px !important; }
.mw100p  { max-width: 150px !important; }
.mw200p  { max-width: 200px !important; }
.mw300p  { max-width: 300px !important; }
.mw400p  { max-width: 400px !important; }
.mw500p  { max-width: 500px !important; }
.mw600p  { max-width: 600px !important; }
.mw700p  { max-width: 700px !important; }
.mw800p  { max-width: 800px !important; }
.mw900p  { max-width: 900px !important; }
.mw1000p  { max-width: 1000px !important; }

.mh10    { max-height: 10% !important; }
.mh20    { max-height: 20% !important; }
.mh25    { max-height: 25% !important; }
.mh30    { max-height: 30% !important; }
.mh33    { max-height: 33.3333% !important; }
.mh40    { max-height: 40% !important; }
.mh45    { max-height: 45% !important; }
.mh50    { max-height: 50% !important; }
.mh60    { max-height: 60% !important; }
.mh66    { max-height: 66.6666% !important; }
.mh70    { max-height: 70% !important; }
.mh75    { max-height: 75% !important; }
.mh80    { max-height: 80% !important; }
.mh90    { max-height: 90% !important; }
.mh100   { max-height: 100% !important; }

.mh50p   { max-height: 50px !important; }
.mh100p  { max-height: 100px !important; }
.mh150p  { max-height: 150px !important; }
.mh200p  { max-height: 200px !important; }
.mh300p  { max-height: 300px !important; }
.mh400p  { max-height: 400px !important; }
.mh500p  { max-height: 500px !important; }
.mh600p  { max-height: 600px !important; }
.mh700p  { max-height: 700px !important; }
.mh800p  { max-height: 800px !important; }
.mh900p  { max-height: 900px !important; }
.mh1000p  { max-height: 1000px !important; }

/* min widths & height */

.minw50  { min-width: 50% !important; }

.minw100p  { min-width: 100px !important; }
.minw200p  { min-width: 200px !important; }

.minh100p  { min-height: 100px !important; }
.minh150p  { min-height: 150px !important; }

.step1::before { content: '1'; }
.step2::before { content: '2'; }
.step3::before { content: '3'; }

/* text horizontal overflow (if inline element, must be applied to block parent) */
.hellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.overflow-hidden {	overflow: hidden;}
/* RESPONSIVE */

.xs-only, .xs-only-inline { display: none; }
.sm-only { display: none; }
.md-only { display: none; }
.lg-only { display: none; }

.xs-exclude { display: block; }
.xs-exclude-inline { display: inline-block; }

/* enable for mobile landscape minimum */
@media screen and (max-width: 479px) {
	.dual-fluid-cols-left-ml > *,
	.dual-fluid-cols-right-ml > * {
		float: none !important;
	}
	.dual-fluid-cols-left-ml > *:first-child + * {
		margin-left: 0 !important;
		margin-top: 20px;
		padding-left: 0 !important;
	}
	.dual-fluid-cols-right-ml > *:first-child + * {
		margin-right: 0 !important;
		margin-top: 20px;
		padding-right: 0 !important;
	}
	.dual-cells-ml {
		display: block;
	}
	.dual-cells-ml > * {
		display: block;
	}
	.hide-on-mobile { display: none; }
	.sd-cancel-float {
		text-align: center !important;
	}
	.sd-cancel-float > * {
		float: none !important;
		margin-top: 10px;
	}
	.sd-cancel-float > *:first-child {
		margin-top: 0;
	}
}
/* enable for tablet portrait minimum */
@media screen and (max-width: 767px) {
    .dual-fluid-cols-left-tp > *,
    .dual-fluid-cols-right-tp > * {
        float: none !important;
    }
    .dual-fluid-cols-left-tp > *:first-child + * {
        margin-left: 0 !important;
        margin-top: 20px;
        padding-left: 0 !important;
    }
    .dual-fluid-cols-right-tp > *:first-child + * {
        margin-right: 0 !important;
        margin-top: 20px;
        padding-right: 0 !important;
    }
	.dual-cells-tp {
		display: block;
	}
	.dual-cells-tp > * {
		display: block;
	}
	.xs-only {
		display: block;
	}
	.xs-only-inline {
		display: inline-block;
	}
	.xs-exclude, .xs-exclude-inline { display: none; }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.sm-only {
		display: block;
	}
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
	.md-only {
		display: block;
	}
}

@media screen and (min-width: 1200px) {
	.lg-only {
		display: block;
	}
}


/* enable for tablet portrait minimum */
@media screen and (max-width: 1023px) {
    .dual-fluid-cols-left-tl > *,
    .dual-fluid-cols-right-tl > * {
        float: none !important;
    }
    .dual-fluid-cols-left-tl > *:first-child + * {
        margin-left: 0 !important;
        margin-top: 20px;
        padding-left: 0 !important;
    }
    .dual-fluid-cols-right-tl > *:first-child + * {
        margin-right: 0 !important;
        margin-top: 20px;
        padding-right: 0 !important;
    }
	.dual-cells-tl {
		display: block;
	}
	.dual-cells-tl > * {
		display: block;
	}
}
