How to add the OpenDyslexic font to a website.

opendyslexic.css

@font-face {
  font-family: 'opendyslexic';
	src: url('http://dyslexicfonts.com/fonts/OpenDyslexic-Regular.otf');
	font-style: normal;
	font-weight: normal;
} 

@font-face {
	font-family: 'opendyslexic';
	src: url('http://dyslexicfonts.com/fonts/OpenDyslexic-Italic.ttf');
	font-style: italic;
	font-weight: normal;
}

@font-face {
	font-family: 'opendyslexic';
	src: url('http://dyslexicfonts.com/fonts/OpenDyslexic-Bold.ttf');
	font-weight: bold;
	font-style: normal;
} 

@font-face {
	font-family: 'opendyslexic';
	src: url('http://dyslexicfonts.com/fonts/OpenDyslexic-BoldItalic.ttf');
	font-weight: bold;
	font-style: italic;
} 

@font-face {
	font-family: eulexia;
	src: url('http://dyslexicfonts.com/fonts/eulexia.ttf');
} 

* {
	font-size:20px;
	line-height:200%;
	color: #191A42;
	font-family:opendyslexic !important;
}