@charset "UTF-8";

/* ============================================================
     SiteUP! (c) J. Alejandro Ceballos Z.
       Name: siteup-practical-l.css - Build 2403
       Uses: siteup-base.css
    License: MIT - https://tldrlegal.com/license/mit-license
   ============================================================ */


@media (min-width:1280px) {

/* ============================================================ [ Structure */

/* ------------------------------------------------------------ [ margin, padding and containers
*/
    .mgn-l { margin:1.625em; }
    .mgn-ltop { margin-top:1.625em; }
    .mgn-lright { margin-right:1.625em; }
    .mgn-lbottom { margin-bottom:1.625em; }
    .mgn-lleft { margin-left:1.625em; }

    .mgn-ltiny { margin:0.375em; }
    .mgn-lsmall { margin:0.625em; }
    .mgn-lmedium { margin:1.0em; }
    .mgn-llarge { margin:2.625em; }
    .mgn-lwide { margin:4.35em; }
    .mgn-lauto { margin:6.25%; }

    .mgn-lno, .container-lno { margin:0; }
    .mgn-lnotop, .container-lnotop { margin-top:0; }
    .mgn-lnoright, .container-lnoright { margin-right:0; }
    .mgn-lnobottom, .container-lnobottom { margin-bottom:0; }
    .mgn-lnoleft, .container-lnoleft { margin-left:0; }

    .pad-l { padding:1.625em; }
    .pad-ltop { padding-top:1.625em; }
    .pad-lright { padding-right:1.625em; }
    .pad-lbottom { padding-bottom:1.625em; }
    .pad-lleft { padding-left:1.625em; }

    .pad-ltiny { padding:0.375em; }
    .pad-lsmall { padding:0.625em; }
    .pad-lmedium { padding:1.0em; }
    .pad-llarge { padding:2.625em; }
    .pad-lwide { padding:4.35em; }
    .pad-lauto { padding:6.25%; }

    .pad-lno, .container-lno { padding:0; }
    .pad-lnotop, .container-lnotop { padding-top:0; }
    .pad-lnoright, .container-lnoright { padding-right:0; }
    .pad-lnobottom, .container-lnobottom { padding-bottom:0; }
    .pad-lnoleft, .container-lnoleft { padding-left:0; }

    .container-l { margin:8.125%; padding:8.125%; }
    .container-ltiny { margin:1.875%; padding: 1.875%; }
    .container-lsmall { margin:3.125%; padding:3.125%; }
    .container-lmedium { margin:5.0%; padding:5.0%; }
    .container-llarge { margin:13.125%; padding:13.125%; }
    .container-lwide { margin:21.75%; padding:21.75%; }

/* ------------------------------------------------------------ [ position and dimension
*/
    .left-l { float:left; }
    .right-l { float:right; }
    .center-l { margin-eft:auto; margin-right:auto; }
    .top-l { vertical-align:top;  }
    .middle-l { vertical-align:middle; }
    .bottom-l { vertical-align:bottom; }

    .size-l20w { width:20%; }
    .size-l25w { width:25%; }
    .size-l33w { width:33.3333333333333333333333%; }
    .size-l40w { width:40%; }
    .size-l50x, .size-lhalf, .size-lhalfw { width:50%; }
    .size-l60w { width:60%; }
    .size-l66w { width:66.6666666666666666666666%; }
    .size-l75w { width:75%; }
    .size-l80w { width:80%; }
    .size-l100w, .size-lfull, .size-lfullw { width:100%; }

    .size-l20h { height:20%; }
    .size-l25h { height:25%; }
    .size-l33h { height:33.3333333333333333333333%; }
    .size-l40h { height:40%; }
    .size-l50x,.size-lhalf,.size-lhalfw { height:50%; }
    .size-l60h { height:60%; }
    .size-l66h { height:66.6666666666666666666666%; }
    .size-l75h { height:75%; }
    .size-l80h { height:80%; }
    .size-l100h, .size-lfull, .size-lfullw { height:100%; }

    .size-lfullv, .size-lfullvw { width:100vw; }
    .size-lfullv, .size-lfullvh { height:100vh; }
    .size-lhalfv, .size-lhalfvw { width:50vw; }
    .size-lhalfv, .size-lhalfvh { height:50vh; }

/* ------------------------------------------------------------ [ row column
*/
    .row-sec { margin-left:auto; margin-right:auto; width:1024px; }
    .row-lmgn { margin-left:auto; margin-right:auto; width:86.78%; }
    .row-lmgntiny { margin-left:auto; margin-right:auto; width:97.76%; }
    .row-lmgnsmall { margin-left:auto; margin-right:auto; width:90.83%; }
    .row-lmgnmedium { margin-left:auto; margin-right:auto; width:81.67%; }
    .row-lmgnlarge { margin-left:auto; margin-right:auto; width:76.97%; }
    .row-lmgnwide { margin-left:auto; margin-right:auto; width:72.11%; }

    /* base12 */
    .col-l1 { width:8.3333333333333333333333%; }
    .col-l2 { width:16.6666666666666666666666%; }
    .col-l3 { width:25%; }
    .col-l4 { width:33.3333333333333333333333%; }
    .col-l5 { width:41.6666666666666666666666%; }
    .col-l6 { width:50%; }
    .col-l7 { width:58.3333333333333333333333%; }
    .col-l8 { width:66.6666666666666666666666%; }
    .col-l9 { width:75%; }
    .col-l10 { width:83.3333333333333333333333%; }
    .col-l11 { width:91.6666666666666666666666%; }
    .col-lpush1 { left:8.3333333333333333333333%; right:auto; position:relative; }
    .col-lpush2 { left:16.6666666666666666666666%; right:auto; position:relative; }
    .col-lpush3 { left:25%; right:auto; position:relative; }
    .col-lpush4 { left:33.3333333333333333333333%; right:auto; position:relative; }
    .col-lpush5 { left:41.6666666666666666666666%; right:auto; position:relative; }
    .col-lpush6 { left:50%; right:auto; position:relative; }
    .col-lpush7 { left:58.3333333333333333333333%; right:auto; position:relative; }
    .col-lpush8 { left:66.6666666666666666666666%; right:auto; position:relative; }
    .col-lpush9 { left:75%; right:auto; position:relative; }
    .col-lpush10 { left:83.3333333333333333333333%; right:auto; position:relative; }
    .col-lpush11 { left:91.6666666666666666666666%; right:auto; position:relative; }
    .col-lpull1 { right:8.3333333333333333333333%; left:auto; position:relative; }
    .col-lpull2 { right:16.6666666666666666666666%; left:auto; position:relative; }
    .col-lpull3 { right:25%; left:auto; position:relative; }
    .col-lpull4 { right:33.3333333333333333333333%; left:auto; position:relative; }
    .col-lpull5 { right:41.6666666666666666666666%; left:auto; position:relative; }
    .col-lpull6 { right:50%; left:auto; position:relative; }
    .col-lpull7 { right:58.3333333333333333333333%; left:auto; position:relative; }
    .col-lpull8 { right:66.6666666666666666666666%; left:auto; position:relative; }
    .col-lpull9 { right:75%; left:auto; position:relative; }
    .col-lpull10 { right:83.3333333333333333333333%; left:auto; position:relative; }
    .col-lpull11 { right:91.6666666666666666666666%; left:auto; position:relative; }
    .col-loff1 { margin-eft:8.3333333333333333333333%; }
    .col-loff2 { margin-eft:16.6666666666666666666666%; }
    .col-loff3 { margin-eft:25%; }
    .col-loff4 { margin-eft:33.3333333333333333333333%; }
    .col-loff5 { margin-eft:41.6666666666666666666666%; }
    .col-loff6 { margin-eft:50%; }
    .col-loff7 { margin-eft:58.3333333333333333333333%; }
    .col-loff8 { margin-eft:66.6666666666666666666666%; }
    .col-loff9 { margin-eft:75%; }
    .col-loff10 { margin-eft:83.3333333333333333333333%; }
    .col-loff11 { margin-eft:91.6666666666666666666666%; }
    .col-lnooff { margin-eft:0; }

    /* base5 */
    .col-l1of5 { width:20%; }
    .col-l2of5 { width:40%; }
    .col-l3of5 { width:60%; }
    .col-l4of5 { width:80%; }
    .col-lpush1of5 { left:20%; right:auto; position:relative; }
    .col-lpush2of5 { left:40%; right:auto; position:relative; }
    .col-lpush3of5 { left:60%; right:auto; position:relative; }
    .col-lpush4of5 { left:80%; right:auto; position:relative; }
    .col-lpull1of5 { right:20%; left:auto; position:relative; }
    .col-lpull2of5 { right:40%; left:auto; position:relative; }
    .col-lpull3of5 { right:60%; left:auto; position:relative; }
    .col-lpull4of5 { right:80%; left:auto; position:relative; }
    .col-loff1of5 { margin-eft:20%; }
    .col-loff2of5 { margin-eft:40%; }
    .col-loff3of5 { margin-eft:60%; }
    .col-loff4of5 { margin-eft:80%; }

    /* base7 */
    .col-l1of7 { width:14.2857142857142857142857%; }
    .col-l2of7 { width:28.5714285714285714285714%; }
    .col-l3of7 { width:42.8571428571428571428571%; }
    .col-l4of7 { width:57.1428571428571428571429%; }
    .col-l5of7 { width:71.4285714285714285714286%; }
    .col-l6of7 { width:85.7142857142857142857143%; }
    .col-lpush1of7 { left:14.2857142857142857142857%; right:auto; position:relative; }
    .col-lpush2of7 { left:28.5714285714285714285714%; right:auto; position:relative; }
    .col-lpush3of7 { left:42.8571428571428571428571%; right:auto; position:relative; }
    .col-lpush4of7 { left:57.1428571428571428571429%; right:auto; position:relative; }
    .col-lpush5of7 { left:71.4285714285714285714286%; right:auto; position:relative; }
    .col-lpush6of7 { left:85.7142857142857142857143%; right:auto; position:relative; }
    .col-lpull1of7 { right:14.2857142857142857142857%; left:auto; position:relative; }
    .col-lpull2of7 { right:28.5714285714285714285714%; left:auto; position:relative; }
    .col-lpull3of7 { right:42.8571428571428571428571%; left:auto; position:relative; }
    .col-lpull4of7 { right:57.1428571428571428571429%; left:auto; position:relative; }
    .col-lpull5of7 { right:71.4285714285714285714286%; left:auto; position:relative; }
    .col-lpull6of7 { right:85.7142857142857142857143%; left:auto; position:relative; }
    .col-loff1of7 { margin-eft:14.2857142857142857142857%; }
    .col-loff2of7 { margin-eft:28.5714285714285714285714%; }
    .col-loff3of7 { margin-eft:42.8571428571428571428571%; }
    .col-loff4of7 { margin-eft:57.1428571428571428571429%; }
    .col-loff5of7 { margin-eft:71.4285714285714285714286%; }
    .col-loff6of7 { margin-eft:85.7142857142857142857143%; }

/* ------------------------------------------------------------ [ grid.cell (base12)
*/
    .grid-linline, .grid-lcollapsed { display:inline-grid; }
    .grid-l1 { grid-template-columns:auto; }
    .grid-l2 { grid-template-columns:auto auto; }
    .grid-l3 { grid-template-columns:auto auto auto; }
    .grid-l4 { grid-template-columns:auto auto auto auto; }
    .grid-l5 { grid-template-columns:auto auto auto auto auto; }
    .grid-l6 { grid-template-columns:auto auto auto auto auto auto; }
    .grid-l7 { grid-template-columns:auto auto auto auto auto auto auto; }
    .grid-l8 { grid-template-columns:auto auto auto auto auto auto auto auto; }
    .grid-l9 { grid-template-columns:auto auto auto auto auto auto auto auto auto; }
    .grid-l10 { grid-template-columns:auto auto auto auto auto auto auto auto auto auto; }
    .grid-l11 { grid-template-columns:auto auto auto auto auto auto auto auto auto auto auto; }
    .grid-l12 { grid-template-columns:auto auto auto auto auto auto auto auto auto auto auto auto; }
    .grid-lnogap { grid-gap:none; }
    .grid-gap { grid-gap:0.625em; }
    .grid-gapsmall { grid-gap:0.125em; }
    .grid-gapbig { grid-gap:1.125em; }
    .grid-lcenter, .grid-lcenterx { justify-content:center; }
    .grid-ljustify, .grid-ljustifyx { justify-content:space-around; }
    .grid-lspaced, .grid-lspacedx { justify-content:space-evenly; }
    .grid-lexteme, .grid-lextemex { justify-content:space-between; }
    .grid-lcenter, .grid-lcentery { align-content:center; }
    .grid-ljustify, .grid-ljustifyy { align-content:space-around; }
    .grid-lspaced, .grid-lspacedy { align-content:space-evenly; }
    .grid-lexteme, .grid-lextemey { align-content:space-between; }
    .grid-ltop { align-content:start; }
    .grid-lright { justify-content:end; }
    .grid-lbottom { align-content:end; }
    .grid-lleft { justify-content:start; }
    .grid > .cell, .grid-linline > .cell, .grid-lcollapsed > .cell { padding:1.125em; }
    .grid-lnopad > .cell { padding:0; }

/* ------------------------------------------------------------ [ border, round
*/
    .round-l { border-radius:0.875em; }
    .round-lno { border-radius:0; }
    .round-lsmall { border-radius:0.375em; }
    .round-lbig { border-radius:1.125em; }
    .round-lquarter { border-radius:12.5%; }
    .round-lhalf { border-radius:25%; }
    .round-lfull { border-radius:50%; }

    .border-l { border:0.375em #666 solid; }
    .border-lno { border:0; }
    .border-lsmall { border:0.125em #666 solid; }
    .border-lmedium { border:0.625em #666 solid; }
    .border-lbig { border:0.875em #666 solid; }

/* ------------------------------------------------------------ [ visibility
*/
    .hide-s, .hide-m, .hide-l { display:none; }
    .show-s, .show-m, .show-l { display:block; }

    @media (orientation:landscape) {
        .show-lh { display:block; }
        .hide-lh { display:none; }
        }

    @media (orientation:portrait) {
        .show-lv { display:block; }
        .hide-lv { display:none; }
        }

/* ------------------------------------------------------------ [ notification
*/
    .bkg-lcritical { background-color:#914; }
    .bkg-ldanger { background-color:#d02; }
    .bkg-lalert { background-color:#f73; }
    .bkg-lwarning { background-color:#fc2; }
    .bkg-lsuccess { background-color:#0b2; }
    .bkg-linform { background-color:#05e; }
    .bkg-lnote { background-color:#ccc; }

    .text-lcritical { color:#914; }
    .text-ldanger { color:#d02; }
    .text-lalert { color:#f73; }
    .text-lwarning { color:#fc2; }
    .text-lsuccess { color:#0b2; }
    .text-linform { color:#05e; }

    .border-lcritical { border-color:#914; }
    .border-ldanger { border-color:#d02; }
    .border-lalert { border-color:#f73; }
    .border-lwarning { border-color:#fc2; }
    .border-lsuccess { border-color:#0b2; }
    .border-linform { border-color:#05e; }

    .lnote { color:#ccc; }
    .lerror { border:0.2em solid #900; }

    }
