Override variable for serif and sans serif font families

static/css/elegant.less

@@ -1,10 +1,14 @@
 @import "../bootstrap/less/bootstrap.less";
 @import "../bootstrap/less/utilities.less";
 
+@import url(http://fonts.googleapis.com/css?family=Open+Sans);
+@import url(http://fonts.googleapis.com/css?family=Roboto);
 @import url(http://fonts.googleapis.com/css?family=Lora);
 
 @page-header-border-color: #8f8686;
 @page-header-color: #8B0000;
+@font-family-sans-serif:  'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+@font-family-monospace: Roboto, Menlo, Monaco, Consolas, "Courier New", monospace;
 @headings-font-family: Lora, Baskerville, Garamond, Georgia, 'DejaVu Serif', 'Times New Roman', Times, Serif;