@font-face {
	font-family: 'roboto';
	font-style: thin;
	font-weight: 300;
	font-display: swap;
	src: url('roboto-thin.ttf') format('truetype');
}

@font-face {
	font-family: 'roboto';
	font-style: light;
	font-weight: 300;
	font-display: swap;
	src: url('roboto-light.ttf') format('truetype');
}

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

@font-face {
	font-family: 'roboto';
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url('roboto-italic.eot');
	src: url('roboto-italic.eot?#iefix') format('embedded-opentype'),
		 url('roboto-italic.woff') format('woff'),
		 url('roboto-italic.ttf') format('truetype'),
		 url('roboto-italic.svg#roboto') format('svg');
}

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

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

@font-face {
	font-family: 'roboto';
	font-style: italic;
	font-weight: 700;
	font-display: swap;
	src: url('roboto-bolditalic.eot');
	src: url('roboto-bolditalic.eot?#iefix') format('embedded-opentype'),
		 url('roboto-bolditalic.woff') format('woff'),
		 url('roboto-bolditalic.ttf') format('truetype'),
		 url('roboto-bolditalic.svg#roboto') format('svg');
}