JSFiddle - React, Tailwind, and code Playground

HTML

@font-face {
    font-family:'BebasNeueRegular';
	src:url('../fonts/BebasNeue-webfont.eot');
	src:url('../fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
	url('../fonts/BebasNeue-webfont.woff') format('woff'),
	url('../fonts/BebasNeue-webfont.ttf') format('truetype'),
	url('../fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
	font-weight:normal;
	font-style:normal;
}
@font-face {
    font-family:'tiefontello';
	src:url('../fonts/tiefontello.eot?88026028');
	src:url('../fonts/tiefontello.eot?88026028#iefix') format('embedded-opentype'),
	url('../fonts/tiefontello.woff?88026028') format('woff'),
	url('../fonts/tiefontello.ttf?88026028') format('truetype'),
	url('../fonts/tiefontello.svg?88026028#fontello') format('svg');
	font-weight:normal;
	font-style:normal;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
@    font-face {
        font-family: 'tiefontello';
        src: url('../fonts/tiefontello.svg?88026028#fontello') format('svg');
    }
}
.blue {
    border: 1px solid #3e76af;
    box-shadow: 0 1px 2px 0 #66b2d2 inset;
    -webkit-box-shadow: 0 1px 2px 0 #66b2d2 inset;
    -moz-box-shadow: 0 1px 2px 0 #66b2d2 inset;
    background: #5ba5cb;
    background: -moz-linear-gradient(top, #5ba5cb 0%, #3a70ab 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5ba5cb), color-stop(100%,#3a70ab));
    background: -webkit-linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    background: -o-linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    background: -ms-linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    background: linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5ba5cb', endColorstr='#3a70ab',GradientType=0 );
}
.button {
    font-size: 12px;
    color: #fff;
    font-weight: bold;
    text-shadow: 0 -1px #6f6f6f;
    display: inline-block;
    line-height: 14px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
   ...

CSS

@font-face {
    font-family:'BebasNeueRegular';
	src:url('../fonts/BebasNeue-webfont.eot');
	src:url('../fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
	url('../fonts/BebasNeue-webfont.woff') format('woff'),
	url('../fonts/BebasNeue-webfont.ttf') format('truetype'),
	url('../fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
	font-weight:normal;
	font-style:normal;
}
@font-face {
    font-family:'tiefontello';
	src:url('../fonts/tiefontello.eot?88026028');
	src:url('../fonts/tiefontello.eot?88026028#iefix') format('embedded-opentype'),
	url('../fonts/tiefontello.woff?88026028') format('woff'),
	url('../fonts/tiefontello.ttf?88026028') format('truetype'),
	url('../fonts/tiefontello.svg?88026028#fontello') format('svg');
	font-weight:normal;
	font-style:normal;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
@    font-face {
        font-family: 'tiefontello';
        src: url('../fonts/tiefontello.svg?88026028#fontello') format('svg');
    }
}
.blue {
    border: 1px solid #3e76af;
    box-shadow: 0 1px 2px 0 #66b2d2 inset;
    -webkit-box-shadow: 0 1px 2px 0 #66b2d2 inset;
    -moz-box-shadow: 0 1px 2px 0 #66b2d2 inset;
    background: #5ba5cb;
    background: -moz-linear-gradient(top, #5ba5cb 0%, #3a70ab 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5ba5cb), color-stop(100%,#3a70ab));
    background: -webkit-linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    background: -o-linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    background: -ms-linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    background: linear-gradient(top, #5ba5cb 0%,#3a70ab 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5ba5cb', endColorstr='#3a70ab',GradientType=0 );
}
.button {
    font-size: 12px;
    color: #fff;
    font-weight: bold;
    text-shadow: 0 -1px #6f6f6f;
    display: inline-block;
    line-height: 14px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
   ...