html { font-size: 10px !important; }
html, body, #root, #root > div { width: 100%; height: 100%; }
body { font-size: 14px; font-size: 1.4rem; color: #505a5e; font-family: 'Ubuntu', sans-serif; margin: 0; padding: 0; }
* { box-sizing: border-box; }
*:focus { outline: none; }

input, select, textarea { font-family: 'Ubuntu', sans-serif; }

.col-20 { width: 20%; min-height: 1px; display: block; float: left; }
.col-33 { width: 33.33%; min-height: 1px; display: block; float: left; }
.col-40 { width: 40%; min-height: 1px; display: block; float: left; }
.col-50 { width: 50%; min-height: 1px; display: block; float: left; }
.col-60 { width: 60%; min-height: 1px; display: block; float: left; }
.col-67 { width: 66.67%; min-height: 1px; display: block; float: left; }
.col-80 { width: 80%; min-height: 1px; display: block; float: left; }

.row { margin: 0 -8px; }
	.row::after { display: block; content: " "; clear: both; }
	.row .col-20,
	.row .col-33,
	.row .col-40,
	.row .col-50,
	.row .col-60,
	.row .col-67,
	.row .col-80 { padding: 0 8px; }

.left { float: left; }
.right { float: right; }
.clear { clear: both; }

.mtop2 { margin-top: 2px !important; }
.mtop4 { margin-top: 4px !important; }
.mtop8 { margin-top: 8px !important; }
.mtop16 { margin-top: 16px !important; }
.mbottom0 { margin-bottom: 0 !important; }
.mbottom2 { margin-bottom: 2px !important; }
.mbottom4 { margin-bottom: 4px !important; }
.mbottom8 { margin-bottom: 8px !important; }
.mbottom16 { margin-bottom: 16px !important; }
.mbottom24 { margin-bottom: 24px !important; }
.mbottom32 { margin-bottom: 32px !important; }
.mleft2 { margin-left: 2px !important; }
.mleft4 { margin-left: 4px !important; }
.mleft8 { margin-left: 8px !important; }
.mleft16 { margin-left: 16px !important; }
.mright2 { margin-right: 2px !important; }
.mright4 { margin-right: 4px !important; }
.mright6 { margin-right: 6px !important; }
.mright8 { margin-right: 8px !important; }
.mright16 { margin-right: 16px !important; }


.bold { font-weight: 700; }
.light-bold { font-weight: 500; }
.normal { font-weight: 400; }
.light { font-weight: 300; }

.hide { display: none; }
.show { display: block; }
.text-overflow { overflow: hidden; white-space: nowrap; text-overflow: ellipsis }
.flex { display: flex; }
.center { margin: 0 auto; }
.flex-center { display: flex !important; justify-content: center; }
.blur { filter: blur(4px); }