<!Doctype html>
<html>
<head>
<title>Test Font Face</title>
<link rel="stylesheet" href="css/roboto/roboto-fontface.css">
<link rel="stylesheet" href="css/roboto-condensed/roboto-condensed-fontface.css">
<style>
body {
background: #F2F2F2;
}
.test-header {
text-align: center;
font-family: 'Roboto-Black';
font-size: 2em;
padding: 0;
margin: 0;
}
.test-header h1 {
padding: 0;
margin: 0;
}
section {
padding: 2% 10%;
margin: 0 auto;
}
/*Roboto*/
.roboto {
font-family: 'Roboto';
}
.roboto-italic {
font-family: 'Roboto-RegularItalic';
}
.roboto-light {
font-family: 'Roboto-Light';
}
.roboto-light-italic {
font-family: 'Roboto-LightItalic';
}
.roboto-bold {
font-family: 'Roboto-Bold';
}
.roboto-bold-italic {
font-family: 'Roboto-BoldItalic';
}
.roboto-medium {
font-family: 'Roboto-Medium';
}
.roboto-medium-italic {
font-family: 'Roboto-MediumItalic';
}
.roboto-thin {
font-family: 'Roboto-Thin';
}
.roboto-thin-italic {
font-family: 'Roboto-ThinItalic';
}
/*Roboto Condensed*/
.roboto-condensed {
font-family: 'Roboto-Condensed';
}
.roboto-condensed-italic {
font-family: 'Roboto-Condensed-RegularItalic';
}
.roboto-condensed-light {
font-family: 'Roboto-Condensed-Light';
}
.roboto-condensed-light-italic {
font-family: 'Roboto-Condensed-LightItalic';
}
.roboto-condensed-bold {
font-family: 'Roboto-Condensed-Bold';
}
.roboto-condensed-bold-italic {
font-family: 'Roboto-Condensed-BoldItalic';
}
</style>
</head>
<body>
<header class="test-header">
<h1>Roboto-Fontface-Bower</h1>
</header>
<!-- Roboto -->
<section class="roboto">
<header>
<h1>I am Roboto</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-italic">
<header>
<h1>I am Roboto Italic</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-light">
<header>
<h1>I am Roboto Light</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-light-italic">
<header>
<h1>I am Roboto Light Italic</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-medium">
<header>
<h1>I am Roboto Medium</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-medium-italic">
<header>
<h1>I am Roboto Medium Italic</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-bold">
<header>
<h1>I am Roboto Bold</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-bold-italic">
<header>
<h1>I am Roboto Bold Italic</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-thin">
<header>
<h1>I am Roboto Thin</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-thin-italic">
<header>
<h1>I am Roboto Thin Italic</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<!-- Roboto Condensed -->
<section class="roboto-condensed">
<header>
<h1>I am RobotoCondensed</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-condensed-italic">
<header>
<h1>I am RobotoCondensed Italic</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-condensed-light">
<header>
<h1>I am RobotoCondensed Light</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-condensed-light-italic">
<header>
<h1>I am RobotoCondensed Light Italic</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-condensed-bold">
<header>
<h1>I am RobotoCondensed Bold</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
<section class="roboto-condensed-bold-italic">
<header>
<h1>I am RobotoCondensed Bold Italic</h1>
</header>
CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty
goodies that make writing CSS fun again.
</section>
</body>
</html>