/*

    HELPERS

    ----------------------------------------------------
*/

/* Color
------------------------------------------------ */

.text-white      { color: white;   }
.text-gold       { color: #9633ff; }
.text-black      { color: black;   }
.text-nearblack  { color: #2D2D2D; }
.text-grey       { color: #888888; }
.text-lightgrey  { color: #b3b3b3; }
.text-blue       { color: #1EAEDB; }
.text-cyan       { color: #9633ff; }
.text-inherit    { color: inherit; }

/* Display
-------------------------------------------------------- */

.block { display: block; }
.inline { display: inline; }
.hidden   { display: none; }
.isHidden { display: none; }
.hidden-v { visibility: hidden; }

.opacity--30pc { opacity: .3; filter: alpha(opacity=30); }
.opacity--40pc { opacity: .4; filter: alpha(opacity=40); }
.opacity--50pc { opacity: .5; filter: alpha(opacity=50); }
.opacity--60pc { opacity: .6; filter: alpha(opacity=60); }
.opacity--70pc { opacity: .7; filter: alpha(opacity=70); }
.opacity--80pc { opacity: .8; filter: alpha(opacity=80); }

.overflow-hidden { overflow: hidden; }
.overflow-scroll { overflow: scroll; }

/* Layout
-------------------------------------------------------- */

.marginless  { margin:  0; }
.paddingless { padding: 0; }
.borderless  { border:  0; }

.w35 { width: 35%; }
.w50 { width: 50%; }
.w60 { width: 60%; }
.w75 { width: 75%; }
.w80 { width: 80%; }
._w100 { width: 100%; }

.h100 { height: 100%; }

.p0  { padding:  0px; }
.p5  { padding:  5px; }
.p10 { padding: 10px; }
.p20 { padding: 20px; }
.p30 { padding: 30px; }

._m0  { margin: 0px; }
._m5  { margin: 5px; }
._m10 { margin: 10px; }
._m15 { margin: 15px; }
._m20 { margin: 20px; }
._m25 { margin: 25px; }

._mt0  { margin-top: 0px; }
._mt5  { margin-top: 5px; }
._mt10 { margin-top: 10px; }
._mt15 { margin-top: 15px; }
._mt20 { margin-top: 20px; }

._mb0  { margin-bottom: 0px; }
._mb5  { margin-bottom: 5px; }
._mb10 { margin-bottom: 10px; }
._mb15 { margin-bottom: 15px; }
._mb20 { margin-bottom: 20px; }

._mr0 { margin-right: 0; }
._mr1 { margin-right: 1px; }
._mr2 { margin-right: 2px; }
._mr5 { margin-right: 5px; }
._mr10 { margin-right: 10px; }
._mr15 { margin-right: 15px; }
._mr20 { margin-right: 20px; }

._ml0 { margin-left: 0; }
._ml1 { margin-left: 1px; }
._ml2 { margin-left: 2px; }
._ml5 { margin-left: 5px; }
._ml10 { margin-left: 10px; }
._ml15 { margin-left: 15px; }
._ml20 { margin-left: 20px; }

/* Offset */

._ot1 { top: 1px; position: relative; }

.mla { margin-left: auto; }
.mra { margin-right: auto; }

._fs-l { font-size: 1.30em; }
._fs-m { font-size: 1.15em; }
._fs-n { font-size: 1.00em; }
._fs-s { font-size: 0.85em; }

/* Font-Weight Helpers */

._fw200 { font-weight: 200; }
._fw300 { font-weight: 300; }
._fw400 { font-weight: 400; }
._fw500 { font-weight: 500; }
._fw600 { font-weight: 600; }
._fw700 { font-weight: 700; }

/* Flex helpers */

._flex { display: flex; }
._flexlr { display: flex; justify-content: space-between; }
._flexlc { display: flex; justify-content: center; }
._flexlrc { display: flex; justify-content: space-between; align-items: center; }
._flexcenter { display: flex; justify-content: center; align-items: center; }
._flexs0 { flex-shrink: 0; }
._flexs1 { flex-shrink: 1; }
._flexg0 { flex-grow: 1; }
._flexg1 { flex-grow: 1; }
._fdr { flex-direction: row; }
._fdc { flex-direction: column; }
._f1 { flex: 1 }

/* Text */

._tc { text-transform: capitalize; }

.wider { }

@media (min-width: 685px){
    .wider { margin-left: -5%; margin-right: -5%; }
}

/* Position
-------------------------------------------------------- */

.pull-left { float: left; }
.pull-right { float: right; }

.relative { position: relative; }
.position-reset { position: initial; }

.clear { overflow: hidden; display: block; width: 100%; }

.v-center { display: table; }
.v-center-inner { display: table-cell; vertical-align: middle; }

.h-center { -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); display: inline-block; left: 50%; position: absolute; margin: 0 auto; }


/* Text
-------------------------------------------------------- */

.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-right  { text-align: right; }

.normal-case    { text-transform: initial; }
.uppercase-case { text-transform: uppercase; }
._t-cap          { text-transform: capitalize; }


/* Images
-------------------------------------------------------- */

figure { display: block; padding: 0; margin: 0; background-position: center; background-size: cover; background: #EFEFEF; background-position: 50%; }
figure img { display: block; width: 100%; }

.img-responsive { width: 100%; display: block; }
.img-objectfit { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }


/* Lists
-------------------------------------------------------- */

.bulletless { list-style: none; }


/* Misc
-------------------------------------------------------- */

.disable-hilight {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


.cursor-pointer { cursor: pointer; }

/*  Ellipsis ( DotDotDot ) */

.readmore { display: none; }
.is-truncated .readmore { display: block; }

.ellipsis--maxheight20 { max-height: 20px; }
.ellipsis--maxheight25 { max-height: 25px; }
.ellipsis--maxheight40 { max-height: 40px; }
.ellipsis--maxheight80 { max-height: 80px; }
.ellipsis--maxheight90 { max-height: 80px; }




.visible-phone { }
    @media screen and (min-width: 600px) { .visible-phone { display: none !important; } }

.hide-phone { }
    @media screen and (max-width: 599px) { *.hide-phone { display: none !important; } }

.visible-tablet { }
    @media screen and (min-width: 1100px) { .visible-tablet { display: none !important; } }
    @media screen and (max-width: 599px)  { .visible-tablet { display: none !important; } }

.hide-tablet { }
    @media screen and (min-width: 600px) and (max-width: 1099px) { .hide-tablet { display: none !important; }}

.visible-desktop { }
    @media screen and (max-width: 1099px) { .visible-desktop { display: none !important; } }

.hide-desktop { }
    @media screen and (min-width: 1100px) { .hide-desktop { display: none !important; } }
