﻿/*==============================================================================
################################################################################
Style Sets CSS is made specifically for Philippine Skylander's Inc's Dev Team. 
An official project of DataReachSolutions Team.
How to use:
    1. Ctrl+F
    2. If not found, just create one 
    3. Make sure it's in alphabetical order when added under the "Current Sets:" list.
        But the classes themselves don't need to be in order when added in this stylesheet.

    Current Sets:
        Background Colors           > .background-
        Font size (Font Awesome)    > .fa-fs
        Font size (Materials Icon)  > .md-fs
        Margin (bottom)             > .margin-bottom-
        Min Height                  > .min-height-
        Padding (bottom)            > .padbottom
        Padding (top)               > .padtop
        Width (percentile)          > .w-
    

================================================================================*/


/*==============================================================================
################################################################################
START OF Font Awesome Vals
*/
/* FA Font sizes fa-fs<SIZEinPX> */
.fa-fs8 { font-size: 8px !important;   }
.fa-fs9 { font-size: 9px !important;   }
.fa-fs10 { font-size: 10px!important;  }
.fa-fs12 { font-size: 12px!important;  }
.fa-fs14 { font-size: 14px!important;  }
.fa-fs16 { font-size: 16px!important;  }
.fa-fs18 { font-size: 18px!important;  }
.fa-fs20 { font-size: 20px!important;  }
.fa-fs22 { font-size: 22px!important;  }
.fa-fs24 { font-size: 24px!important;  }
.fa-fs26 { font-size: 26px!important;  }
.fa-fs28 { font-size: 28px!important;  }
.fa-fs30 { font-size: 30px!important;  }
.fa-fs32 { font-size: 32px!important;  }
.fa-fs34 { font-size: 34px!important;  }
.fa-fs36 { font-size: 36px!important;  }
.fa-fs38 { font-size: 38px!important;  }
.fa-fs40 { font-size: 40px!important;  }
.fa-fs42 { font-size: 42px!important;  }
.fa-fs44 { font-size: 44px!important;  }
.fa-fs46 { font-size: 46px!important;  }
.fa-fs48 { font-size: 48px!important;  }
.fa-fs50 { font-size: 50px!important;  }
.fa-fs52 { font-size: 52px!important;  }
.fa-fs54 { font-size: 54px!important;  }
.fa-fs56 { font-size: 56px!important;  }
.fa-fs58 { font-size: 58px!important;  }
.fa-fs60 { font-size: 60px!important;  }
.fa-fs62 { font-size: 62px!important;  }
.fa-fs64 { font-size: 64px!important;  }
.fa-fs66 { font-size: 66px!important;  }
.fa-fs68 { font-size: 68px!important;  }
.fa-fs70 { font-size: 70px!important;  }
.fa-fs72 { font-size: 72px!important;  }
.fa-fs74 { font-size: 74px!important;  }
.fa-fs76 { font-size: 76px!important;  }
.fa-fs78 { font-size: 78px!important;  }
.fa-fs80 { font-size: 80px!important;  }
.fa-fs82 { font-size: 82px!important;  }
.fa-fs84 { font-size: 84px!important;  }
.fa-fs86 { font-size: 86px!important;  }
.fa-fs88 { font-size: 88px!important;  }
.fa-fs90 { font-size: 90px!important;  }
.fa-fs92 { font-size: 92px!important;  }
.fa-fs94 { font-size: 94px!important;  }
.fa-fs96 { font-size: 96px!important;  }
.fa-fs98 { font-size: 98px!important;  }
.fa-fs100 { font-size: 100px!important; } 
.fa-fs102 { font-size: 102px!important; }
.fa-fs104 { font-size: 104px!important; }
.fa-fs106 { font-size: 106px!important; }
.fa-fs108 { font-size: 108px!important; }

/*
END OF Font Awesome Vals
================================================================================*/

/*==============================================================================
################################################################################
START OF Material Icon Vals
*/

/* MI Font sizes md-fs<SIZEinPX> */
.md-fs8 {
    font-size: 8px!important;
}

.md-fs10 {
    font-size: 10px!important;
}

.md-fs12 {
    font-size: 12px!important;
}

.md-fs14 {
    font-size: 14px!important;
}

.md-fs16 {
    font-size: 16px!important;
}

.md-fs18 {
    font-size: 18px!important;
}

.md-fs20 {
    font-size: 20px!important;
}

.md-fs22 {
    font-size: 22px!important;
}

.md-fs24 {
    font-size: 24px!important;
}

.md-fs26 {
    font-size: 26px!important;
}

.md-fs28 {
    font-size: 28px!important;
}

.md-fs30 {
    font-size: 30px!important;
}

.md-fs32 {
    font-size: 32px!important;
}

.md-fs34 {
    font-size: 34px!important;
}

.md-fs36 {
    font-size: 36px!important;
}

.md-fs38 {
    font-size: 38px!important;
}

.md-fs40 {
    font-size: 40px!important;
}

.md-fs42 {
    font-size: 42px!important;
}

.md-fs44 {
    font-size: 44px!important;
}

.md-fs46 {
    font-size: 46px!important;
}

.md-fs48 {
    font-size: 48px!important;
}

.md-fs50 {
    font-size: 50px!important;
}

.md-fs52 {
    font-size: 52px!important;
}

.md-fs54 {
    font-size: 54px!important;
}

.md-fs56 {
    font-size: 56px!important;
}

.md-fs58 {
    font-size: 58px!important;
}

.md-fs60 {
    font-size: 60px!important;
}

.md-fs62 {
    font-size: 62px!important;
}

.md-fs64 {
    font-size: 64px!important;
}

.md-fs66 {
    font-size: 66px!important;
}

.md-fs68 {
    font-size: 68px!important;
}

.md-fs70 {
    font-size: 70px!important;
}

.md-fs72 {
    font-size: 72px!important;
}

.md-fs74 {
    font-size: 74px!important;
}

.md-fs76 {
    font-size: 76px!important;
}

.md-fs78 {
    font-size: 78px!important;
}

.md-fs80 {
    font-size: 80px!important;
}

.md-fs82 {
    font-size: 82px!important;
}

.md-fs84 {
    font-size: 84px!important;
}

.md-fs86 {
    font-size: 86px!important;
}

.md-fs88 {
    font-size: 88px!important;
}

.md-fs90 {
    font-size: 90px!important;
}

.md-fs92 {
    font-size: 92px!important;
}

.md-fs94 {
    font-size: 94px!important;
}

.md-fs96 {
    font-size: 96px!important;
}

.md-fs98 {
    font-size: 98px!important;
}

.md-fs100 {
    font-size: 100px!important;
}

.md-fs102 {
    font-size: 102px!important;
}

.md-fs104 {
    font-size: 104px!important;
}

.md-fs106 {
    font-size: 106px!important;
}

.md-fs108 {
    font-size: 108px!important;
}



/*
END OF Material Icons Vals
================================================================================*/

/* padding */
.pad0{
    padding: 0px !important;
}

/* padding-right */
.padright0 {
    padding-right: 0px !important;
}

.padright8 {
    padding-right: 8px !important;
}

.padright10 {
    padding-right: 10px !important;
}

.padright12 {
    padding-right: 12px !important;
}

.padright14 {
    padding-right: 14px !important;
}

.padright16 {
    padding-right: 16px !important;
}

.padright18 {
    padding-right: 18px !important;
}

.padright20 {
    padding-right: 20px !important;
}

.padright22 {
    padding-right: 22px !important;
}

.padright24 {
    padding-right: 24px !important;
}

.padright26 {
    padding-right: 26px !important;
}

.padright28 {
    padding-right: 28px !important;
}

.padright30 {
    padding-right: 30px !important;
}

.padright32 {
    padding-right: 32px !important;
}

.padright34 {
    padding-right: 34px !important;
}

.padright36 {
    padding-right: 36px !important;
}

.padright38 {
    padding-right: 38px !important;
}

.padright40 {
    padding-right: 40px !important;
}

.padright42 {
    padding-right: 42px !important;
}

.padright44 {
    padding-right: 44px !important;
}

.padright46 {
    padding-right: 46px !important;
}

.padright48 {
    padding-right: 48px !important;
}

.padright50 {
    padding-right: 50px !important;
}

.padright52 {
    padding-right: 52px !important;
}

.padright54 {
    padding-right: 54px !important;
}

.padright56 {
    padding-right: 56px !important;
}

.padright58 {
    padding-right: 58px !important;
}

.padright60 {
    padding-right: 60px !important;
}

.padright62 {
    padding-right: 62px !important;
}

.padright64 {
    padding-right: 64px !important;
}

.padright66 {
    padding-right: 66px !important;
}

.padright68 {
    padding-right: 68px !important;
}

.padright70 {
    padding-right: 70px !important;
}

.padright72 {
    padding-right: 72px !important;
}

.padright74 {
    padding-right: 74px !important;
}

.padright76 {
    padding-right: 76px !important;
}

.padright78 {
    padding-right: 78px !important;
}

.padright80 {
    padding-right: 80px !important;
}

.padright82 {
    padding-right: 82px !important;
}

.padright84 {
    padding-right: 84px !important;
}

.padright86 {
    padding-right: 86px !important;
}

.padright88 {
    padding-right: 88px !important;
}

.padright90 {
    padding-right: 90px !important;
}

.padright92 {
    padding-right: 92px !important;
}

.padright94 {
    padding-right: 94px !important;
}

.padright96 {
    padding-right: 96px !important;
}

.padright98 {
    padding-right: 98px !important;
}

.padright100 {
    padding-right: 100px !important;
}

.padright102 {
    padding-right: 102px !important;
}

.padright104 {
    padding-right: 104px !important;
}

.padright106 {
    padding-right: 106px !important;
}

.padright108 {
    padding-right: 108px !important;
}


/* padding-bottom */
.padbottom0 {
    padding-bottom: 0px !important;
}

.padbottom4 {
    padding-bottom: 4px !important;
}

.padbottom8 {
    padding-bottom: 8px !important;
}

.padbottom10 {
    padding-bottom: 10px !important;
}

.padbottom12 {
    padding-bottom: 12px !important;
}

.padbottom14 {
    padding-bottom: 14px !important;
}

.padbottom16 {
    padding-bottom: 16px !important;
}

.padbottom18 {
    padding-bottom: 18px !important;
}

.padbottom20 {
    padding-bottom: 20px !important;
}

.padbottom22 {
    padding-bottom: 22px !important;
}

.padbottom24 {
    padding-bottom: 24px !important;
}

.padbottom26 {
    padding-bottom: 26px !important;
}

.padbottom28 {
    padding-bottom: 28px !important;
}

.padbottom30 {
    padding-bottom: 30px !important;
}

.padbottom32 {
    padding-bottom: 32px !important;
}

.padbottom34 {
    padding-bottom: 34px !important;
}

.padbottom36 {
    padding-bottom: 36px !important;
}

.padbottom38 {
    padding-bottom: 38px !important;
}

.padbottom40 {
    padding-bottom: 40px !important;
}

.padbottom42 {
    padding-bottom: 42px !important;
}

.padbottom44 {
    padding-bottom: 44px !important;
}

.padbottom46 {
    padding-bottom: 46px !important;
}

.padbottom48 {
    padding-bottom: 48px !important;
}

.padbottom50 {
    padding-bottom: 50px !important;
}

.padbottom52 {
    padding-bottom: 52px !important;
}

.padbottom54 {
    padding-bottom: 54px !important;
}

.padbottom56 {
    padding-bottom: 56px !important;
}

.padbottom58 {
    padding-bottom: 58px !important;
}

.padbottom60 {
    padding-bottom: 60px !important;
}

.padbottom62 {
    padding-bottom: 62px !important;
}

.padbottom64 {
    padding-bottom: 64px !important;
}

.padbottom66 {
    padding-bottom: 66px !important;
}

.padbottom68 {
    padding-bottom: 68px !important;
}

.padbottom70 {
    padding-bottom: 70px !important;
}

.padbottom72 {
    padding-bottom: 72px !important;
}

.padbottom74 {
    padding-bottom: 74px !important;
}

.padbottom76 {
    padding-bottom: 76px !important;
}

.padbottom78 {
    padding-bottom: 78px !important;
}

.padbottom80 {
    padding-bottom: 80px !important;
}

.padbottom82 {
    padding-bottom: 82px !important;
}

.padbottom84 {
    padding-bottom: 84px !important;
}

.padbottom86 {
    padding-bottom: 86px !important;
}

.padbottom88 {
    padding-bottom: 88px !important;
}

.padbottom90 {
    padding-bottom: 90px !important;
}

.padbottom92 {
    padding-bottom: 92px !important;
}

.padbottom94 {
    padding-bottom: 94px !important;
}

.padbottom96 {
    padding-bottom: 96px !important;
}

.padbottom98 {
    padding-bottom: 98px !important;
}

.padbottom100 {
    padding-bottom: 100px !important;
}

.padbottom102 {
    padding-bottom: 102px !important;
}

.padbottom104 {
    padding-bottom: 104px !important;
}

.padbottom106 {
    padding-bottom: 106px !important;
}

.padbottom108 {
    padding-bottom: 108px !important;
}

/* padding-top */
.padtop0{
    padding-top: 0px !important;
}
.padtop4 {
    padding-top: 4px !important;
}
.padtop6 {
    padding-top: 6px !important;
}
.padtop8 {
    padding-top: 8px !important;
}

.padtop10 {
    padding-top: 10px !important;
}

.padtop12 {
    padding-top: 12px !important;
}

.padtop14 {
    padding-top: 14px !important;
}

.padtop16 {
    padding-top: 16px !important;
}

.padtop18 {
    padding-top: 18px !important;
}

.padtop20 {
    padding-top: 20px !important;
}

.padtop22 {
    padding-top: 22px !important;
}

.padtop24 {
    padding-top: 24px !important;
}

.padtop26 {
    padding-top: 26px !important;
}

.padtop28 {
    padding-top: 28px !important;
}

.padtop30 {
    padding-top: 30px !important;
}

.padtop32 {
    padding-top: 32px !important;
}

.padtop34 {
    padding-top: 34px !important;
}

.padtop36 {
    padding-top: 36px !important;
}

.padtop38 {
    padding-top: 38px !important;
}

.padtop40 {
    padding-top: 40px !important;
}

.padtop42 {
    padding-top: 42px !important;
}

.padtop44 {
    padding-top: 44px !important;
}

.padtop46 {
    padding-top: 46px !important;
}

.padtop48 {
    padding-top: 48px !important;
}

.padtop50 {
    padding-top: 50px !important;
}

.padtop52 {
    padding-top: 52px !important;
}

.padtop54 {
    padding-top: 54px !important;
}

.padtop56 {
    padding-top: 56px !important;
}

.padtop58 {
    padding-top: 58px !important;
}

.padtop60 {
    padding-top: 60px !important;
}

.padtop62 {
    padding-top: 62px !important;
}

.padtop64 {
    padding-top: 64px !important;
}

.padtop66 {
    padding-top: 66px !important;
}

.padtop68 {
    padding-top: 68px !important;
}

.padtop70 {
    padding-top: 70px !important;
}

.padtop72 {
    padding-top: 72px !important;
}

.padtop74 {
    padding-top: 74px !important;
}

.padtop76 {
    padding-top: 76px !important;
}

.padtop78 {
    padding-top: 78px !important;
}

.padtop80 {
    padding-top: 80px !important;
}

.padtop82 {
    padding-top: 82px !important;
}

.padtop84 {
    padding-top: 84px !important;
}

.padtop86 {
    padding-top: 86px !important;
}

.padtop88 {
    padding-top: 88px !important;
}

.padtop90 {
    padding-top: 90px !important;
}

.padtop92 {
    padding-top: 92px !important;
}

.padtop94 {
    padding-top: 94px !important;
}

.padtop96 {
    padding-top: 96px !important;
}

.padtop98 {
    padding-top: 98px !important;
}

.padtop100 {
    padding-top: 100px !important;
}

.padtop102 {
    padding-top: 102px !important;
}

.padtop104 {
    padding-top: 104px !important;
}

.padtop106 {
    padding-top: 106px !important;
}

.padtop108 {
    padding-top: 108px !important;
}


/* Fine-tuned Percentile Widths */
.w-5{
    width: 5% !important;
}
.w-8{
    width: 8% !important;
}
.w-10 {
    width: 10% !important;
}
.w-12 {
    width: 12% !important;
}
.w-15 {
    width: 15% !important;
}
.w-20 {
    width: 20% !important;
}
.w-25 {
    width: 25% !important;
}
.w-30 {
    width: 30% !important;
}
.w-35 {
    width: 35% !important;
}
.w-40 {
    width: 40% !important;
}
.w-45 {
    width: 45% !important;
}
.w-50 {
    width: 50% !important;
}
.w-55 {
    width: 55% !important;
}
.w-60 {
    width: 60% !important;
}
.w-65 {
    width: 65% !important;
}
.w-68 {
    width: 68% !important;
}
.w-70 {
    width: 70% !important;
}
.w-75 {
    width: 75% !important;
}
.w-80 {
    width: 80% !important;
}
.w-85 {
    width: 85% !important;
}
.w-90 {
    width: 90% !important;
}
.w-95 {
    width: 95% !important;
}
.w-100 {
    width: 100% !important;
}

/* bottom margin set */
.margin-bottom-2 {
    margin-bottom: 2px;
}
.margin-bottom-4 {
    margin-bottom: 4px;
}
.margin-bottom-6 {
    margin-bottom: 6px;
}
.margin-bottom-8 {
    margin-bottom: 8px;
}
.margin-bottom-10 {
    margin-bottom: 10px;
}
.margin-bottom-12 {
    margin-bottom: 12px;
}
.margin-bottom-14 {
    margin-bottom: 14px;
}
.margin-bottom-16 {
    margin-bottom: 16px;
}
.margin-bottom-18 {
    margin-bottom: 18px;
}
.margin-bottom-20 {
    margin-bottom: 20px;
}
.margin-bottom-22 {
    margin-bottom: 22px;
}
.margin-bottom-24 {
    margin-bottom: 24px;
}
.margin-bottom-26 {
    margin-bottom: 26px;
}
.margin-bottom-28 {
    margin-bottom: 28px;
}
.margin-bottom-30 {
    margin-bottom: 30px;
}
.margin-bottom-32 {
    margin-bottom: 32px;
}
.margin-bottom-34 {
    margin-bottom: 34px;
}
.margin-bottom-36 {
    margin-bottom: 36px;
}
.margin-bottom-38 {
    margin-bottom: 38px;
}
.margin-bottom-40 {
    margin-bottom: 40px;
}
.margin-bottom-42 {
    margin-bottom: 42px;
}
.margin-bottom-44 {
    margin-bottom: 44px;
}
.margin-bottom-46 {
    margin-bottom: 46px;
}
.margin-bottom-48 {
    margin-bottom: 48px;
}
.margin-bottom-50 {
    margin-bottom: 50px;
}
.margin-bottom-52 {
    margin-bottom: 52px;
}
.margin-bottom-54 {
    margin-bottom: 54px;
}
.margin-bottom-56 {
    margin-bottom: 56px;
}
.margin-bottom-58 {
    margin-bottom: 58px;
}
.margin-bottom-60 {
    margin-bottom: 60px;
}
.margin-bottom-62 {
    margin-bottom: 62px;
}
.margin-bottom-64 {
    margin-bottom: 64px;
}


/* min height set */
.min-height-64 {
    min-height: 64px;
}
.min-height-64-req {
    min-height: 64px !important;
}
.min-height-80{
   min-height: 80px;
}
.min-height-96 {
    min-height: 96px;
}
.min-height-128 {
    min-height: 128px;
}
.min-height-240{
    min-height: 240px;
}
.min-height-360 {
    min-height: 360px;
}
.min-height-480 {
    min-height: 480px;
}
.min-height-560 {
    min-height: 560px;
}
.min-height-640 {
    min-height: 640px;
}

/* background colors */
.background-yellow{
    background-color: yellow;
}