@charset "UTF-8";

/* Defaults */

* {
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6 { font-size: 2rem; }

p { font-size: 1.5rem; }

@media (max-width: 756px) {
    h1, h2, h3, h4, h5, h6 { font-size: 1.5rem; }
    
    p { font-size: 1rem; }
}

/* Margins */

.margin-auto { margin: auto; }
.margin-none { margin: 0; }
.margin-1 { margin: 0.25rem; }
.margin-2 { margin: 0.5rem; }
.margin-3 { margin: 1rem; }
.margin-4 { margin: 2rem; }
.margin-5 { margin: 4rem; }

.margin-top-auto { margin-top: auto; }
.margin-top-none { margin-top: 0; }
.margin-top-1 { margin-top: 0.25rem; }
.margin-top-2 { margin-top: 0.5rem; }
.margin-top-3 { margin-top: 1rem; }
.margin-top-4 { margin-top: 2rem; }
.margin-top-5 { margin-top: 4rem; }

.margin-right-auto { margin-right: auto; }
.margin-right-none { margin-right: 0; }
.margin-right-1 { margin-right: 0.25rem; }
.margin-right-2 { margin-right: 0.5rem; }
.margin-right-3 { margin-right: 1rem; }
.margin-right-4 { margin-right: 2rem; }
.margin-right-5 { margin-right: 4rem; }

.margin-bottom-auto { margin-bottom: auto; }
.margin-bottom-none { margin-bottom: 0; }
.margin-bottom-1 { margin-bottom: 0.25rem; }
.margin-bottom-2 { margin-bottom: 0.5rem; }
.margin-bottom-3 { margin-bottom: 1rem; }
.margin-bottom-4 { margin-bottom: 2rem; }
.margin-bottom-5 { margin-bottom: 4rem; }

.margin-left-auto { margin-left: auto; }
.margin-left-none { margin-left: 0; }
.margin-left-1 { margin-left: 0.25rem; }
.margin-left-2 { margin-left: 0.5rem; }
.margin-left-3 { margin-left: 1rem; }
.margin-left-4 { margin-left: 2rem; }
.margin-left-5 { margin-left: 4rem; }

/* Padding */

.padding-none { padding: 0; }
.padding-1 { padding: 0.25rem; }
.padding-2 { padding: 0.5rem; }
.padding-3 { padding: 1rem; }
.padding-4 { padding: 2rem; }
.padding-5 { padding: 4rem; }

.padding-top-none { padding-top: 0; }
.padding-top-1 { padding-top: 0.25rem; }
.padding-top-2 { padding-top: 0.5rem; }
.padding-top-3 { padding-top: 1rem; }
.padding-top-4 { padding-top: 2rem; }
.padding-top-5 { padding-top: 4rem; }

.padding-right-none { padding-right: 0; }
.padding-right-1 { padding-right: 0.25rem; }
.padding-right-2 { padding-right: 0.5rem; }
.padding-right-3 { padding-right: 1rem; }
.padding-right-4 { padding-right: 2rem; }
.padding-right-5 { padding-right: 4rem; }

.padding-bottom-none { padding-bottom: 0; }
.padding-bottom-1 { padding-bottom: 0.25rem; }
.padding-bottom-2 { padding-bottom: 0.5rem; }
.padding-bottom-3 { padding-bottom: 1rem; }
.padding-bottom-4 { padding-bottom: 2rem; }
.padding-bottom-5 { padding-bottom: 4rem; }

.padding-left-none { padding-left: 0; }
.padding-left-1 { padding-left: 0.25rem; }
.padding-left-2 { padding-left: 0.5rem; }
.padding-left-3 { padding-left: 1rem; }
.padding-left-4 { padding-left: 2rem; }
.padding-left-5 { padding-left: 4rem; }

/* Width */

.width-100 { width: 100%; }
.width-75 { width: 75%; }
.width-50 { width: 50%; }
.width-25 { width: 25%; }

/* Height */

.height-100 { height: 100%; }
.height-75 { height: 75%; }
.height-50 { height: 50%; }
.height-25 { height: 25%; }

/* Display */

.display-none { display: none; }
.display-block { display: block; }
.display-inline { display: inline; }
.display-inline-block { display: inline-block; }

/* Round Corners */

.rounded { border-radius: 0.25rem; }
.rounded-circle { border-radius: 50%; }
.no-round { border-radius: 0; }

/* Text Alignment */

.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }
.text-justify { text-align: justify; }

/* Text Decoration */

.text-underline { text-decoration: underline; }
.text-italic { font-style: italic; }
.font-weight-bold { font-weight: bold; }
.font-weight-regular { font-weight: normal; }
.text-none { text-decoration: none; }

/* Containers */

.grid-container { display: grid; }
.flex-container, .flex-container-80 { display: flex; }

.flex-container-80 {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

/* Flex Controls */

.flex-column { flex-direction: column; }

/* Font Sizes */

.font-small { font-size: 0.5rem; }
.font-medium { font-size: 1.5rem; }
.font-large { font-size: 2rem; }
.font-extra-large { font-size: 3rem; }
.font-huge { font-size: 5rem; }

@media (max-width: 756px) {

    /* Font Sizes */
    .font-small { font-size: 0.25rem; }
    .font-medium { font-size: 1rem; }
    .font-large { font-size: 1.5rem; }
    .font-extra-large { font-size: 2rem; }
    .font-huge { font-size: 3rem; }
}
