/*
    For the sake of readability, hide/show classes are ordered by size/direction:
    1. visibility-size
    2. visibility-size-dn
    3. visibility-size-up
*/

@media only screen   
{
  
    .abs { position: absolute;}
    .rel { position: relative;}
    .static { position: static;}
    .hide { display: none; }
    .hidden { visibility: hidden; }
    .m0 { margin: 0;}
    .p0 { padding: 0;}

    .table { display: table; }
    .trow { display: table-row;}
    .tcell { display: table-cell;}    
    .inline {display: inline;}
    .block {display: block;}
    .iblock {display: inline-block;}    
    .float-left { float: left;}
    .float-right { float: right;}
    .float-none { float: none;}    
    .clear-left { clear: left;}
    .clear-right { clear: right;}    
    .clear-both { clear: both;}    
    .text-left { text-align: left;}
    .text-center { text-align: center;}
    .text-right { text-align: right;}
    .text-justify { text-align: justify;}    

    .hide-tiny,
    .show-sml,
    .hide-sml-dn,
    .show-sml-up,
    .show-med,
    .hide-med-dn,
    .show-med-up,
    .show-lrg,
    .hide-lrg-dn
    {
        display: none !important;
    }

    .show-tiny,
    .show-tiny-up,
    .hide-sml,
    .show-sml-dn,
    .hide-sml-up,
    .hide-med,
    .show-med-dn,
    .hide-med-up,
    .hide-lrg,
    .show-lrg-dn
    {
        display: inherit !important;
    }

}

/* Small Screens - 480px and up */
@media    (min-width: 30em)
{
    .show-tiny,
    .hide-tiny-up,
    .hide-sml,
    .hide-sml-up,
    .hide-sml-dn,
    .show-med,
    .hide-med-dn,
    .show-med-up,
    .show-lrg,
    .hide-lrg-dn
    {
        display: none !important;
    }


    .hide-tiny,
    .show-tiny-up,
    .show-sml,
    .show-sml-up,
    .show-sml-dn,
    .hide-med,
    .show-med-dn,
    .hide-med-up,
    .hide-lrg,
    .show-lrg-dn
    {
        display: inherit !important;
    }

    .inline-sml
    {
        display: inline !important;
    }

    .iblock-sml
    {
        display: inline-block !important;
    }

    .block-sml
    {
        display: block !important;
    }
    .table-sml { display: table !important; }
    .trow-sml { display: table-row !important;}
    .tcell-sml { display: table-cell !important;}

    .float-left-sml { float: left;}
    .float-right-sml { float: right;}
    .float-none-sml { float: none;}
    .clear-left-sml { clear: left;}
    .clear-right-sml { clear: right;}    
    .clear-both-sml { clear: both;}       

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

}

/* Medium Screens - 800px and up */
@media    (min-width: 50em)
{
    .show-tiny,
    .hide-tiny-up,
    .show-sml,
    .hide-sml-up,
    .show-sml-dn,
    .hide-med,
    .hide-med-dn,
    .hide-med-up,
    .show-lrg,
    .hide-lrg-dn
    {
        display: none !important;
    }

    .hide-tiny,
    .show-tiny-up,
    .hide-sml,
    .show-sml-up,
    .hide-sml-dn,
    .show-med,
    .show-med-dn,
    .show-med-up,
    .hide-lrg,
    .show-lrg-dn
    {
        display: inherit !important;
    }


    .inline-med

    {
        display: inline !important;
    }


    .iblock-med

    {
        display: inline-block !important;
    }


    .block-med

    {
        display: block !important;
    }

    .table-med { display: table !important; }
    .trow-med { display: table-row !important;}
    .tcell-med { display: table-cell !important;}


    .float-left-med { float: left;}
    .float-right-med { float: right;}
    .float-none-med { float: none;}
    .clear-left-med { clear: left;}
    .clear-right-med { clear: right;}    
    .clear-both-med { clear: both;}   

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

}

/* Large Screens - 1280px and up */
@media    (min-width: 80em)
{

    .show-tiny,
    .hide-tiny-up,
    .show-sml,
    .hide-sml-up,
    .show-sml-dn,
    .show-med,
    .show-med-dn,
    .hide-med-up,
    .hide-lrg,
    .hide-lrg-dn
    {
        display: none !important;
    }

    .hide-tiny,
    .show-tiny-up,
    .hide-sml,
    .show-sml-up,
    .hide-sml-dn,
    .hide-med,
    .hide-med-dn,
    .show-med-up,
    .show-lrg,
    .show-lrg-dn
    {
        display: inherit !important;
    }

    .inline-lrg

    {
        display: inline !important;
    }

    .iblock-lrg
    {
        display: inline-block !important;
    }

    .block-lrg
    {
        display: block !important;
    }

    .table-lrg { display: table !important; }
    .trow-lrg { display: table-row !important;}
    .tcell-lrg { display: table-cell !important;}
    .float-left-lrg { float: left;}
    .float-right-lrg { float: right;}
    .float-none-lrg { float: none; }
    .clear-left-lrg { clear: left;}
    .clear-right-lrg { clear: right;}    
    .clear-both-lrg { clear: both;}   

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

}
