@import "variables";
//custom variables
$width100: 100%;
$margin20: 20px;
$margin10: 10px;
$margin5: 5px;
$margin0: 0;
$pad20: 20px;
$pad10: 10px;
$pad5: 5px;
$pad0: 0;

$textLeft: left;
$textRight: right;
$textCenter: center;

//fonts
$font10: 10px;
$font11: 11px;
$font12: 12px;
$font13: 13px;
$font14: 14px;
$font16: 16px;
$font18: 18px;
$font20: 20px;

//custom mixins
@mixin truncate() {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;;
}
@mixin transform($transform){
	-webkit-transform: $transform;  
	-moz-transform:    $transform;
	-ms-transform:     $transform; 
	-o-transform:      $transform; 
	transform:         $transform;
}
@mixin transition($transition) {
	-webkit-transition: $transition;  
	-moz-transition:    $transition;
	-ms-transition:     $transition; 
	-o-transition:      $transition; 
	transition:         $transition;
}
@mixin borderRadius($radius) {
  border-radius: $radius;
   -o-border-radius: $radius;
   -moz-border-radius: $radius;
   -webkit-border-radius: $radius;
}

// custom classes
.width100{ width: $width100; }
.marginT20{ margin-top: $margin20; }
.marginB20{ margin-bottom: $margin20; }
.marginT5{ margin-top: $margin5; }
.marginB5{ margin-bottom: $margin5; }
.marginL5{ margin-left: $margin5; }
.marginR5{ margin-right: $margin5; }
.marginT10{ margin-top: $margin10; }
.marginB10{ margin-bottom: $margin10; }
.marginL10{ margin-left: $margin10; }
.marginR10{ margin-right: $margin10; }
.margin0{ margin: $margin0; }
.paddingT20{ padding-top: $pad20; }
.paddingB20{ padding-bottom: $pad20; }
.paddingL20{ padding-left: $pad20; }
.paddingR20{ padding-right: $pad20; }
.paddingT5{ padding-top: $pad5; }
.paddingB5{ padding-bottom: $pad5; }
.paddingL5{ padding-left: $pad5; }
.paddingR5{ padding-right: $pad5; }
.padding0{ padding: $pad0; }
.font16{ font-size: $font16; }
.font18{ font-size: $font18; }
.vTop{ vertical-align: top; }
.truncate{
    @include truncate;
}
.dn{ display: none; }
.dib{ display: inline-block; }
.db{ display: block; }

@media (max-width: $grid-float-breakpoint){
    $margin20: 1.667em;
    $margin10: 0.833em;
    $margin5: 0.417em;
    $pad20: 1.667em;
    $pad10: 0.833em;
    $pad5: 0.417em;
    //fonts
    $font10: 0.8333em;
    $font11: 0.917em;
    $font12: 1.000em;
    $font13: 1.083em;
    $font14: 1.167em;
    $font16: 1.333em;
    $font18: 1.500em;
    $font20: 1.667em;
    .mobdn{ display: none; }
    .list-view-pf {
        .list-group-item-heading{
            font-size: 1.083em;
        }
    }
}