/* Coded by: Alfonsus David */

@font-face {
    font-family: 'Big Shoulders Display';
    src: url('../fonts/BigShouldersDisplay-Regular.eot');
    src: url('../fonts/BigShouldersDisplay-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BigShouldersDisplay-Regular.woff2') format('woff2'),
        url('../fonts/BigShouldersDisplay-Regular.woff') format('woff'),
        url('../fonts/BigShouldersDisplay-Regular.ttf') format('truetype'),
        url('../fonts/BigShouldersDisplay-Regular.svg#BigShouldersDisplay-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Big Shoulders Display';
    src: url('../fonts/BigShouldersDisplay-Bold.eot');
    src: url('../fonts/BigShouldersDisplay-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BigShouldersDisplay-Bold.woff2') format('woff2'),
        url('../fonts/BigShouldersDisplay-Bold.woff') format('woff'),
        url('../fonts/BigShouldersDisplay-Bold.ttf') format('truetype'),
        url('../fonts/BigShouldersDisplay-Bold.svg#BigShouldersDisplay-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Regular.eot');
    src: url('../fonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-Regular.woff2') format('woff2'),
        url('../fonts/Roboto-Regular.woff') format('woff'),
        url('../fonts/Roboto-Regular.ttf') format('truetype'),
        url('../fonts/Roboto-Regular.svg#Roboto-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Bold.eot');
    src: url('../fonts/Roboto-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-Bold.woff2') format('woff2'),
        url('../fonts/Roboto-Bold.woff') format('woff'),
        url('../fonts/Roboto-Bold.ttf') format('truetype'),
        url('../fonts/Roboto-Bold.svg#Roboto-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

body{
	font-weight: normal;
	font-style: normal;
	color: #fff;
}

/* BOLD AND ITALIC */
strong{ font-weight: bold; }
em{ font-style: italic; }
strong em, em strong{
	font-style: italic;
	font-weight: bold;
}

/* ANCHOR */
a, .anchor{
	text-decoration: none;
	outline: none;
	color: #fff;
	cursor: pointer;
	
	-moz-transition: color 0.3s;
    -webkit-transition: color 0.3s;
    -o-transition: color 0.3s;
    transition: color 0.3s;
}
a:hover, a:active,
.anchor:hover, .anchor:active
{ text-decoration: underline; }
a:hover img, a:active img,
.anchor:hover img, .anchor:active img
{ text-decoration: none; }
a:link, a:visited { }

/* MARGIN */
h1{ margin-top: 10px; }
h2{ margin-top: 5px; }
p{ margin-top: 5px; }

/* FONT WEIGHT */
h1, h2, h3, h4{ font-weight: bold; }

/* FONT COLOR */

/* FONT FAMILY */
body, button{ font-family: 'Roboto'; }
h1, h2, h3, h4{ font-family: 'Big Shoulders Display'; }


/* FONT SIZE */
body{ font-size: 18px; }
h1{ font-size: 9em; }
h2{ font-size: 5em; }
h3{ font-size: 2.5em; }
h4{ font-size: 1.8em; }

/* LINE HEIGHT */
body{ line-height: 1.5em; }
h1, h2, h3, h4{ line-height: 1.2em; }
p{ line-height: 1.8em; }
a{ line-height: 1em; }

h3{
	text-transform: uppercase;
	font-weight: bold;
	/* letter-spacing: 0.3em; */
}

.uppercase{ text-transform: uppercase; }