@import url( 'embeded-fonts.css' );

@import url( 'yellow.css' )( min-width: 0px );      /* YELLOW   : Tiny Devices */
@import url( 'orange.css' )( min-width: 568px );    /* ORANGE   : Tiny Devices */ 
@import url( 'green.css' )( min-width: 768px );     /* GREEN    : Small Devices */
@import url( 'blue.css' )( min-width: 992px );      /* BLUE     : Medium Devices */
@import url( 'red.css' )( min-width: 1200px );      /* RED      : Large Devices */

@import url( 'navbar.css' );

/*
TYNYVISE.COM
------------------------------------------------------------
Author: Juan C Gutierrez
------------------------------------------------------------

Developement References:

BOOTSTRAP 4 CLASSES:

col-xs :    Tiny Devices   : below 768px    ( Mobile menu appearse )  
            Debugging BG color : YELLOW, ORANGE
            horizontal alignment in Red, Blue, Green, Orange, Yellow. 
            no vertically stacking.
            Note: burger appears at 767px and below, YELLOW, ORANGE.

col-sm :    Small Devices  : equal & above 768px      
            Debugging BG color : GREEN
            horizontal alignment in Red, Blue, Green. 
            below 768px they stack vertically

col-md :    Medium Devices : equal & above 992px      
            Debugging BG color : BLUE
            horizontal alignment in Red, Blue. 
            below 992px they stack vertically

col-lg :    Large Devices  : equal & above 1200px     
            Debugging BG color : RED
            horizontal alignment in Red. 
            below 1200px they stack vertically


REM MEASUREMENTS:

10px = 0.625rem
11px = 0.6875rem
12px = 0.75rem
13px = 0.8125rem
14px = 0.875rem
15px = 0.9375rem
16px = 1rem
17px = 1.0625rem
18px = 1.125rem
19px = 1.1875rem
20px = 1.25rem
21px = 1.3125rem
22px = 1.375rem
23px = 1.4375rem
24px = 1.5rem
25px = 1.563rem
26px = 1.625rem
27px = 1.688rem
28px = 1.750rem
29px = 1.813rem
30px = 1.875rem
31px = 1.938rem
32px = 2rem
33px = 2.0625rem
34px = 2.125rem
35px = 2.1875rem
36px = 2.25rem
37px = 2.3125rem
38px = 2.375rem
39px = 2.4375rem
40px = 2.5rem
41px = 2.5625rem
42px = 2.625rem
43px = 2.6875rem
44px = 2.75rem
45px = 2.8125rem
46px = 2.875rem
47px = 2.9375rem
48px = 3rem
49px = 3.0625rem
50px = 3.125rem


DEBUGGING CLASSES:
*/

.red {
    border: 1px solid red;
}

.blue {
    border: 1px solid blue;
}

.yellow {
    border: 1px solid yellow;
}

.orange {
    border: 1px solid orange;
}

.green {
    border: 1px solid green;
}

.purple {
    border: 1px solid purple;
}

.black {
    border: 1px solid black;
}

.white {
    border: 1px solid white;
}

.gray {
    border: 1px solid gray;
}