/*!
font-family: 'Work Sans', sans-serif;
font-family: 'Raleway', sans-serif;
*/
html,
body { height: 100%; margin: 0; padding: 0;}
body {font-family: 'Work Sans', sans-serif;}
.bgIn { float: left; width: 100%;}
.bgLeft { float: left; width: 50%; position: fixed; background: #0e123d; height: 100%; left: 0;}
.bgRight { float: right; width: 50%; position: fixed; background: #ee2025; height: 100%; right: 0;}
.bf { position:absolute; width: 100%; height: 100%; background: rgba(14, 18, 61, 0.6); text-align: center;}
.br { position:absolute; width: 100%; height: 100%; background: rgba(238, 32, 36, 0.6); text-align: center; }
.bfText { float: left; width: 100%; margin-top: 30%;}
.bfText h2 { font-size: 32px; color: #fff;}
.bfText h5 { font-size: 20px; color: #000; border: 2px solid #fff; background: #fff; padding: 20px 70px; border-radius: 200px; width: auto; display: inline-block; font-weight: 600; margin: 0; text-transform: uppercase;}
.bfText h5:hover { background: #000; color: #fff;}

@media(max-width:767px) {
.bgLeft { width: 100%; height: 50%; top: 0; background-size: cover !important;}
.bgRight { width: 100%; height: 50%; bottom: 0; background-size: cover !important;}
.bfText { margin-top: 7%;}
.bfText img { height: 60px;}
.bfText h2 { font-size: 22px;}
.bfText h5 {font-size: 18px; padding: 13px 34px;}
}
@media(max-width:500px) {
.bfText { margin-top: 10%;}
}
@media(max-width:420px) {
.bfText { margin-top: 12%;}
}
@media(max-width:1350px) {}