*{ font-family: 'FiraSans'; word-wrap: break-word; font-weight: normal; } body,input[type=text],input[type=password],textarea{ font-size: 130%; } pre { font-family: 'FiraMono'; white-space: pre-wrap; } @media only screen and (min-width: 400px){ body,input[type=text],input[type=password],textarea{ font-size: 120%; } } @media only screen and (min-width: 800px){ body,input[type=text],input[type=password],textarea{ font-size: 110%; } } @media only screen and (min-width: 1100px){ body,input[type=text],input[type=password],textarea{ font-size: 100%; } } @font-face { font-family: 'FiraSans'; src: url('fonts/FiraSans/FiraSans/FiraSans-Regular.eot'); src: url('fonts/FiraSans/FiraSans-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/FiraSans/FiraSans-Regular.woff') format('woff'), url('fonts/FiraSans/FiraSans-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'FiraSans'; src: url('fonts/FiraSans/FiraSans-Light.eot'); src: url('fonts/FiraSans/FiraSans-Light.eot?#iefix') format('embedded-opentype'), url('fonts/FiraSans/FiraSans-Light.woff') format('woff'), url('fonts/FiraSans/FiraSans-Light.ttf') format('truetype'); font-weight: 300; font-style: normal; } @font-face { font-family: 'FiraSans'; src: url('fonts/FiraSans/FiraSans-Medium.eot'); src: url('fonts/FiraSans/FiraSans-Medium.eot?#iefix') format('embedded-opentype'), url('fonts/FiraSans/FiraSans-Medium.woff') format('woff'), url('fonts/FiraSans/FiraSans-Medium.ttf') format('truetype'); font-weight: 500; font-style: normal; } @font-face { font-family: 'FiraSans'; src: url('fonts/FiraSans/FiraSans-Bold.eot'); src: url('fonts/FiraSans/FiraSans-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/FiraSans/FiraSans-Bold.woff') format('woff'), url('fonts/FiraSans/FiraSans-Bold.ttf') format('truetype'); font-weight: bold; font-style: normal; } @font-face { font-family: 'FiraMono'; src: url('fonts/FiraMono/FiraMono/FiraMono-Regular.eot'); src: url('fonts/FiraMono/FiraMono-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/FiraMono/FiraMono-Regular.woff') format('woff'), url('fonts/FiraMono/FiraMono-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'FiraMono'; src: url('fonts/FiraMono/FiraMono-Bold.eot'); src: url('fonts/FiraMono/FiraMono-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/FiraMono/FiraMono-Bold.woff') format('woff'), url('fonts/FiraMono/FiraMono-Bold.ttf') format('truetype'); font-weight: bold; font-style: normal; }