﻿
/* ------------------------------------------------------------------------------------------------------------------------- */
body { }

/* ------------------------------------------------------------------------------------------------------------------------- */
div.fillerH-x1, div.fillerH-x2,div.fillerH-x3,div.fillerH-x4, div.fillerH-x5{ clear: both; display: block; opacity: 0; }
div.fillerH-x1{ height: 2rem; }
div.fillerH-x2{ height: 4rem; }
div.fillerH-x3{ height: 6rem; }
div.fillerH-x4{ height: 8rem; }
div.fillerH-x5{ height: 10rem; }

img.float-left { float:left; margin: 0.1rem;}
img.float-right { float:right; margin: 0.1rem;}

img.icon-xs{ width: 2rem; }
img.icon-sm{ width: 3.75rem; }
img.icon-md{ width: 5.5rem; }
img.icon-lg{ width: 7.25rem; }
img.icon-xl{ width: 9rem; }

img.icon-fit-xs{ height: 0.8rem; }
img.icon-fit-sm{ height: 1.5rem; }
img.icon-fit-md{ height: 2.3rem; }
img.icon-fit-lg{ height: 3.1rem; }
img.icon-fit-xl{ height: 3.9rem; }

/* ------------------------------------------------------------------------------------------------------------------------- */
.indent-left-x1{ margin-left: 2rem !important;}
.indent-left-x2{ margin-left: 4rem !important; }
.indent-left-x3{ margin-left: 6.5rem !important; }
.indent-left-x4{ margin-left: 8rem !important; }
.indent-left-x5{ margin-left: 10rem !important; }

.indent-right-x1{ margin-right: 2rem !important; }
.indent-right-x2{ margin-right: 4rem !important; }
.indent-right-x3{ margin-right: 6rem !important; }
.indent-right-x4{ margin-right: 8rem !important; }
.indent-right-x4{ margin-right: 10rem !important; }

/* ------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------- */
/* MEDIA QUERYS*/
/* mobile small */
@media screen and (max-width: 600px){
    .sm-text-left { text-align:left; }
    .sm-text-center { text-align:center; }
    .sm-text-right { text-align: right; }
    .sm-text-justify { text-align: justify; }

    .sm-line-sm{ line-height: 1.3rem !important; }
    .sm-line-md{ line-height: 2.2rem !important; }
    .sm-line-lg{ line-height: 3.1rem !important; }
    .sm-line-xl{ line-height: 3.8rem !important; }

    .sm-indent-left-x1{ margin-left: 2rem !important;}
    .sm-indent-left-x2{ margin-left: 4rem !important; }
    .sm-indent-left-x3{ margin-left: 6.5rem !important; }
    .sm-indent-left-x4{ margin-left: 8rem !important; }
    .sm-indent-left-x5{ margin-left: 10rem !important; }

    .sm-indent-right-x1{ margin-right: 2rem !important; }
    .sm-indent-right-x2{ margin-right: 4rem !important; }
    .sm-indent-right-x3{ margin-right: 6rem !important; }
    .sm-indent-right-x4{ margin-right: 8rem !important; }
    .sm-indent-right-x4{ margin-right: 10rem !important; }
}
/* tablet medium */
@media screen and (min-width: 601px){
    .md-text-left { text-align:left; }
    .md-text-center { text-align:center; }
    .md-text-right { text-align: right; }
    .md-text-justify { text-align: justify; }

    .md-font-x2 { font-size: 2rem; }
    .md-font-x3 { font-size: 3rem; }
    .md-font-x4 { font-size: 4rem; }
    .md-font-x5 { font-size: 5rem; }

    .md-line-sm{ line-height: 1.5rem !important; }
    .md-line-md{ line-height: 2.25rem !important; }
    .md-line-lg{ line-height: 3rem !important; }
    .md-line-xl{ line-height: 3.75rem !important; }

    .md-indent-left-x1{ margin-left: 2rem !important;}
    .md-indent-left-x2{ margin-left: 4rem !important; }
    .md-indent-left-x3{ margin-left: 6.5rem !important; }
    .md-indent-left-x4{ margin-left: 8rem !important; }
    .md-indent-left-x5{ margin-left: 10rem !important; }

    .md-indent-right-x1{ margin-right: 2rem !important; }
    .md-indent-right-x2{ margin-right: 4rem !important; }
    .md-indent-right-x3{ margin-right: 6rem !important; }
    .md-indent-right-x4{ margin-right: 8rem !important; }
    .md-indent-right-x4{ margin-right: 10rem !important; }
}
/* deskop large */
@media screen and (min-width: 993px){
    .lg-text-left { text-align:left; }
    .lg-text-center { text-align:center; }
    .lg-text-right { text-align: right; }
    .lg-text-justify { text-align: justify; }

    .lg-line-sm{ line-height: 1.5rem !important; }
    .lg-line-md{ line-height: 2.25rem !important; }
    .lg-line-lg{ line-height: 3rem !important; }
    .lg-line-xl{ line-height: 3.75rem !important; }

    .lg-indent-left-x1{ margin-left: 2rem !important;}
    .lg-indent-left-x2{ margin-left: 4rem !important; }
    .lg-indent-left-x3{ margin-left: 6.5rem !important; }
    .lg-indent-left-x4{ margin-left: 8rem !important; }
    .lg-indent-left-x5{ margin-left: 10rem !important; }

    .lg-indent-right-x1{ margin-right: 2rem !important; }
    .lg-indent-right-x2{ margin-right: 4rem !important; }
    .lg-indent-right-x3{ margin-right: 6rem !important; }
    .lg-indent-right-x4{ margin-right: 8rem !important; }
    .lg-indent-right-x4{ margin-right: 10rem !important; }
}
/* lg desktop xlarge */
@media screen and (min-width: 1201px){
    .xl-text-left { text-align:left; }
    .xl-text-center { text-align:center; }
    .xl-text-right { text-align: right; }
    .xl-text-justify { text-align: justify; }

    .lg-line-sm{ line-height: 1.5rem !important; }
    .lg-line-md{ line-height: 2.25rem !important; }
    .lg-line-lg{ line-height: 3rem !important; }
    .lg-line-xl{ line-height: 3.75rem !important; }

    .xl-indent-left-x1{ margin-left: 2rem !important;}
    .xl-indent-left-x2{ margin-left: 4rem !important; }
    .xl-indent-left-x3{ margin-left: 6.5rem !important; }
    .xl-indent-left-x4{ margin-left: 8rem !important; }
    .xl-indent-left-x5{ margin-left: 10rem !important; }

    .xl-indent-right-x1{ margin-right: 2rem !important; }
    .xl-indent-right-x2{ margin-right: 4rem !important; }
    .xl-indent-right-x3{ margin-right: 6rem !important; }
    .xl-indent-right-x4{ margin-right: 8rem !important; }
    .xl-indent-right-x4{ margin-right: 10rem !important; }
}
