@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(Roboto/Roboto-Regular.ttf); /* For IE6-8 */
    src: local('Roboto'), local('Roboto-Regular'), url(Roboto/Roboto-Regular.ttf) format('truetype');
}

@font-face {
    font-family: 'Roboto-Thin';
    font-style: normal;
    font-weight: 100;
    src: url(Roboto/Roboto-Thin.ttf); /* For IE6-8 */
    src: local('Roboto-Thin'), local('Roboto-Thin'), url(Roboto/Roboto-Thin.ttf) format('truetype');
}

@font-face {
    font-family: 'Roboto-Light';
    font-style: normal;
    font-weight: 300;
    src: url(Roboto/Roboto-Light.ttf); /* For IE6-8 */
    src: local('Roboto-Light'), local('Roboto-Light'), url(Roboto/Roboto-Light.ttf) format('truetype');
}

@font-face {
    font-family: 'Roboto-Bold';
    font-style: normal;
    font-weight: 500;
    src: url(Roboto/Roboto-Medium.ttf); /* For IE6-8 */
    src: local('Roboto-Bold'), local('Roboto-Medium'), url(Roboto/Roboto-Medium.ttf) format('truetype');
}

@font-face {
    font-family: 'RobotoMono';
    font-style: normal;
    font-weight: 400;
    src: url(Roboto_Mono/RobotoMono-Regular.ttf); /* For IE6-8 */
    src: local('RobotoMono'), local('RobotoMono-Regular'), url(Roboto_Mono/RobotoMono-Regular.ttf) format('truetype');
}

.material-icons {
    color:white;
}

.material-icons.md-18 {
    font-size: 18px;
}

.material-icons.md-24 {
    font-size: 24px;
}

.material-icons.md-36 {
    font-size: 36px;
}

.material-icons.md-48 {
    font-size: 48px;
}

.material-icons.big {
    font-size: 3.6vw !important;
}
.material-icons.orange600 {
    color: #FB8C00;
}