/*!
 * CSS file icons v0.1.0 (https://colorswall.github.io/CSS-file-icons)
 * Copyright 2020 The CSS file icons Authors
 * Licensed under MIT
 */

.fi {
	width: 36px;
	height: 46px;
	padding: 10px 0 0;
	position: relative;
	margin: 5 auto;
	transition: all 0.2s ease-in-out;
	cursor: pointer;
	box-sizing: border-box;
	font-family: sans-serif;
	text-decoration: none;
	display: block;
}

.fi:before,
.fi:after {
	position: absolute;
	content: '';
	pointer-events: none
}

.fi:before {
	left: 0;
	top: 0;
	height: 100%;
	left: 0;
	background-color: #007bff;
	right: 10px
}

.fi:after {
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px 0 0 10px;
	border-color: transparent transparent transparent #66b0ff;
	top: 0;
	right: 0
}

.fi:hover {
	transform: translate(0, -5px)
}

.fi-content {
	background-color: #007bff;
	top: 10px;
	color: #fff;
	position: absolute;
	left: 0;
	bottom: 0;
	right: 0;
	padding: 16.5px 0.3em 0;
	font-size: 13px;
	font-weight: 500;
	position: absolute
}

.fi-mp3.fi:before {
	background-color: #156aea
}

.fi-mp3.fi:after {
	border-left-color: #5291ef
}

.fi-mp3.fi .fi-content {
	background-color: #156aea;
	color: #fff
}

.fi-wav.fi:before {
	background-color: #36af14
}

.fi-wav.fi:after {
	border-left-color: #4be520
}

.fi-wav.fi .fi-content {
	background-color: #36af14;
	color: #fff
}

.fi-aif.fi:before {
	background-color: #f55f73
}

.fi-aif.fi:after {
	border-left-color: #f99daa
}

.fi-aif.fi .fi-content {
	background-color: #f55f73;
	color: #fff
}

.fi-cda.fi:before {
	background-color: #1081d1
}

.fi-cda.fi:after {
	border-left-color: #34a2ef
}

.fi-cda.fi .fi-content {
	background-color: #1081d1;
	color: #fff
}

.fi-mid.fi:before {
	background-color: #21c6fc
}

.fi-mid.fi:after {
	border-left-color: #62d7fd
}

.fi-mid.fi .fi-content {
	background-color: #21c6fc;
	color: #fff
}

.fi-midi.fi:before {
	background-color: #03afe7
}

.fi-midi.fi:after {
	border-left-color: #30cafc
}

.fi-midi.fi .fi-content {
	background-color: #03afe7;
	color: #fff
}

.fi-mpa.fi:before {
	background-color: #8deef1
}

.fi-mpa.fi:after {
	border-left-color: #c8f7f8
}

.fi-mpa.fi .fi-content {
	background-color: #8deef1;
	color: #00013a
}

.fi-mkv.fi:before {
	background-color: #ec93d8
}

.fi-mkv.fi:after {
	border-left-color: #f6cbec
}

.fi-mkv.fi .fi-content {
	background-color: #ec93d8;
	color: #00013a
}

.fi-ogg.fi:before {
	background-color: #576c7b
}

.fi-ogg.fi:after {
	border-left-color: #768d9e
}

.fi-ogg.fi .fi-content {
	background-color: #576c7b;
	color: #fff
}

.fi-wpa.fi:before {
	background-color: #214767
}

.fi-wpa.fi:after {
	border-left-color: #316a99
}

.fi-wpa.fi .fi-content {
	background-color: #214767;
	color: #fff
}

.fi-wpl.fi:before {
	background-color: #2383f5
}

.fi-wpl.fi:after {
	border-left-color: #62a7f8
}

.fi-wpl.fi .fi-content {
	background-color: #2383f5;
	color: #fff
}

.fi-7z.fi:before {
	background-color: #f63
}

.fi-7z.fi:after {
	border-left-color: #ff9875
}

.fi-7z.fi .fi-content {
	background-color: #f63;
	color: #fff
}

.fi-zip.fi:before {
	background-color: #ffb229
}

.fi-zip.fi:after {
	border-left-color: #ffca6b
}

.fi-zip.fi .fi-content {
	background-color: #ffb229;
	color: #fff
}

.fi-rar.fi:before {
	background-color: #ac3cc1
}

.fi-rar.fi:after {
	border-left-color: #c26ed2
}

.fi-rar.fi .fi-content {
	background-color: #ac3cc1;
	color: #1c148a
}

.fi-tar-gz.fi:before {
	background-color: #c6ad86
}

.fi-tar-gz.fi:after {
	border-left-color: #dbccb3
}

.fi-tar-gz.fi .fi-content {
	background-color: #c6ad86;
	color: #665538
}

.fi-pkg.fi:before {
	background-color: #955b2a
}

.fi-pkg.fi:after {
	border-left-color: #c77b3a
}

.fi-pkg.fi .fi-content {
	background-color: #955b2a;
	color: #ebc645
}

.fi-z.fi:before {
	background-color: #b69663
}

.fi-z.fi:after {
	border-left-color: #cbb490
}

.fi-z.fi .fi-content {
	background-color: #b69663;
	color: #665538
}

.fi-csv.fi:before {
	background-color: #579704
}

.fi-csv.fi:after {
	border-left-color: #7cd806
}

.fi-csv.fi .fi-content {
	background-color: #579704;
	color: #fff
}

.fi-dat.fi:before {
	background-color: #0463ea
}

.fi-dat.fi:after {
	border-left-color: #3587fc
}

.fi-dat.fi .fi-content {
	background-color: #0463ea;
	color: #fff
}

.fi-json.fi:before {
	background-color: #333
}

.fi-json.fi:after {
	border-left-color: #545454
}

.fi-json.fi .fi-content {
	background-color: #333;
	color: #aaa
}

.fi-xml.fi:before {
	background-color: #0e886b
}

.fi-xml.fi:after {
	border-left-color: #14c49a
}

.fi-xml.fi .fi-content {
	background-color: #0e886b;
	color: #fff
}

.fi-dat.fi:before {
	background-color: #8b9c35
}

.fi-dat.fi:after {
	border-left-color: #b0c350
}

.fi-dat.fi .fi-content {
	background-color: #8b9c35;
	color: #fff
}

.fi-db.fi:before {
	background-color: #697628
}

.fi-db.fi:after {
	border-left-color: #95a739
}

.fi-db.fi .fi-content {
	background-color: #697628;
	color: #fff
}

.fi-dbf.fi:before {
	background-color: #58e6a9
}

.fi-dbf.fi:after {
	border-left-color: #92efc7
}

.fi-dbf.fi .fi-content {
	background-color: #58e6a9;
	color: #fff
}

.fi-sql.fi:before {
	background-color: #157efb
}

.fi-sql.fi:after {
	border-left-color: #56a2fc
}

.fi-sql.fi .fi-content {
	background-color: #157efb;
	color: #fff
}

.fi-ns.fi:before {
	background-color: #249c3b
}

.fi-ns.fi:after {
	border-left-color: #32d051
}

.fi-ns.fi .fi-content {
	background-color: #249c3b;
	color: #422c21
}

.fi-3ds.fi:before {
	background-color: #015051
}

.fi-3ds.fi:after {
	border-left-color: #029192
}

.fi-3ds.fi .fi-content {
	background-color: #015051;
	color: #fff
}

.fi-max.fi:before {
	background-color: #02b4b6
}

.fi-max.fi:after {
	border-left-color: #03f4f7
}

.fi-max.fi .fi-content {
	background-color: #02b4b6;
	color: #fff
}

.fi-ai.fi:before {
	background-color: #f67503
}

.fi-ai.fi:after {
	border-left-color: #fd983f
}

.fi-ai.fi .fi-content {
	background-color: #f67503;
	color: #fff
}

.fi-psd.fi:before {
	background-color: #181040
}

.fi-psd.fi:after {
	border-left-color: #2c1d75
}

.fi-psd.fi .fi-content {
	background-color: #181040;
	color: #3db6f2
}

.fi-ttf.fi:before {
	background-color: #174f57
}

.fi-ttf.fi:after {
	border-left-color: #257f8b
}

.fi-ttf.fi .fi-content {
	background-color: #174f57;
	color: #fff
}

.fi-woff.fi:before {
	background-color: #1b8c73
}

.fi-woff.fi:after {
	border-left-color: #26c4a1
}

.fi-woff.fi .fi-content {
	background-color: #1b8c73;
	color: #fff
}

.fi-woff2.fi:before {
	background-color: #177761
}

.fi-woff2.fi:after {
	border-left-color: #22ae8f
}

.fi-woff2.fi .fi-content {
	background-color: #177761;
	color: #fff
}

.fi-png.fi:before {
	background-color: #dc7460
}

.fi-png.fi:after {
	border-left-color: #e8a496
}

.fi-png.fi .fi-content {
	background-color: #dc7460;
	color: #fff
}

.fi-bmp.fi:before {
	background-color: #459fa0
}

.fi-bmp.fi:after {
	border-left-color: #69bdbe
}

.fi-bmp.fi .fi-content {
	background-color: #459fa0;
	color: #fff
}

.fi-jpg.fi:before {
	background-color: #0074d0
}

.fi-jpg.fi:after {
	border-left-color: #1397ff
}

.fi-jpg.fi .fi-content {
	background-color: #0074d0;
	color: #fff
}

.fi-jpeg.fi:before {
	background-color: #0066b7
}

.fi-jpeg.fi:after {
	border-left-color: #008bf9
}

.fi-jpeg.fi .fi-content {
	background-color: #0066b7;
	color: #fff
}

.fi-gif.fi:before {
	background-color: #7979ec
}

.fi-gif.fi:after {
	border-left-color: #b3b3f4
}

.fi-gif.fi .fi-content {
	background-color: #7979ec;
	color: #fff
}

.fi-tif.fi:before {
	background-color: #ce0258
}

.fi-tif.fi:after {
	border-left-color: #fd1677
}

.fi-tif.fi .fi-content {
	background-color: #ce0258;
	color: #fff
}

.fi-tiff.fi:before {
	background-color: #b5024d
}

.fi-tiff.fi:after {
	border-left-color: #f60269
}

.fi-tiff.fi .fi-content {
	background-color: #b5024d;
	color: #fff
}

.fi-svg.fi:before {
	background-color: #e6a420
}

.fi-svg.fi:after {
	border-left-color: #edbc5c
}

.fi-svg.fi .fi-content {
	background-color: #e6a420;
	color: #fff
}

.fi-rss.fi:before {
	background-color: #fd8b33
}

.fi-rss.fi:after {
	border-left-color: #feb075
}

.fi-rss.fi .fi-content {
	background-color: #fd8b33;
	color: #fff
}

.fi-torrent.fi:before {
	background-color: #55ac44
}

.fi-torrent.fi:after {
	border-left-color: #7bc56d
}

.fi-torrent.fi .fi-content {
	background-color: #55ac44;
	color: #fff
}

.fi-ppt.fi:before {
	background-color: #ce4123
}

.fi-ppt.fi:after {
	border-left-color: #e26b52
}

.fi-ppt.fi .fi-content {
	background-color: #ce4123;
	color: #fff
}

.fi-pps.fi:before {
	background-color: #bf4023
}

.fi-pps.fi:after {
	border-left-color: #dd6347
}

.fi-pps.fi .fi-content {
	background-color: #bf4023;
	color: #fff
}

.fi-pptx.fi:before {
	background-color: #ac3a1f
}

.fi-pptx.fi:after {
	border-left-color: #da5334
}

.fi-pptx.fi .fi-content {
	background-color: #ac3a1f;
	color: #fff
}

.fi-odp.fi:before {
	background-color: #38aef9
}

.fi-odp.fi:after {
	border-left-color: #78c8fb
}

.fi-odp.fi .fi-content {
	background-color: #38aef9;
	color: #fff
}

.fi-asp.fi:before {
	background-color: #5c2d91
}

.fi-asp.fi:after {
	border-left-color: #7c3dc3
}

.fi-asp.fi .fi-content {
	background-color: #5c2d91;
	color: #fff
}

.fi-c.fi:before {
	background-color: #3747a5
}

.fi-c.fi:after {
	border-left-color: #5767c7
}

.fi-c.fi .fi-content {
	background-color: #3747a5;
	color: #fff
}

.fi-cs.fi:before {
	background-color: #013467
}

.fi-cs.fi:after {
	border-left-color: #0255a9
}

.fi-cs.fi .fi-content {
	background-color: #013467;
	color: #fff
}

.fi-java.fi:before {
	background-color: #ea2c2e
}

.fi-java.fi:after {
	border-left-color: #f0686a
}

.fi-java.fi .fi-content {
	background-color: #ea2c2e;
	color: #fff
}

.fi-jsp.fi:before {
	background-color: #e5000c
}

.fi-jsp.fi:after {
	border-left-color: #ff2834
}

.fi-jsp.fi .fi-content {
	background-color: #e5000c;
	color: #161419
}

.fi-swift.fi:before {
	background-color: #f32a20
}

.fi-swift.fi:after {
	border-left-color: #f6665f
}

.fi-swift.fi .fi-content {
	background-color: #f32a20;
	color: #fff
}

.fi-php.fi:before {
	background-color: #4f5b93
}

.fi-php.fi:after {
	border-left-color: #717db3
}

.fi-php.fi .fi-content {
	background-color: #4f5b93;
	color: #fff
}

.fi-hh.fi:before {
	background-color: #505050
}

.fi-hh.fi:after {
	border-left-color: #717171
}

.fi-hh.fi .fi-content {
	background-color: #505050;
	color: #fff
}

.fi-go.fi:before {
	background-color: #e0ebf5
}

.fi-go.fi:after {
	border-left-color: #fff
}

.fi-go.fi .fi-content {
	background-color: #e0ebf5;
	color: #000
}

.fi-py.fi:before {
	background-color: #3472a3
}

.fi-py.fi:after {
	border-left-color: #5294c8
}

.fi-py.fi .fi-content {
	background-color: #3472a3;
	color: #ffd542
}

.fi-js.fi:before {
	background-color: #f0db4f
}

.fi-js.fi:after {
	border-left-color: #f5e78c
}

.fi-js.fi .fi-content {
	background-color: #f0db4f;
	color: #323330
}

.fi-html.fi:before {
	background-color: #e54c21
}

.fi-html.fi:after {
	border-left-color: #ec7c5c
}

.fi-html.fi .fi-content {
	background-color: #e54c21;
	color: #fff
}

.fi-xhtml.fi:before {
	background-color: #55a9ef
}

.fi-xhtml.fi:after {
	border-left-color: #92c8f5
}

.fi-xhtml.fi .fi-content {
	background-color: #55a9ef;
	color: #fff
}

.fi-css.fi:before {
	background-color: #264de4
}

.fi-css.fi:after {
	border-left-color: #617deb
}

.fi-css.fi .fi-content {
	background-color: #264de4;
	color: #fff
}

.fi-vb.fi:before {
	background-color: #19aad9
}

.fi-vb.fi:after {
	border-left-color: #4ac3ea
}

.fi-vb.fi .fi-content {
	background-color: #19aad9;
	color: #fff
}

.fi-rb.fi:before {
	background-color: #a20d01
}

.fi-rb.fi:after {
	border-left-color: #e41201
}

.fi-rb.fi .fi-content {
	background-color: #a20d01;
	color: #fff
}

.fi-scss.fi:before {
	background-color: #bf4080
}

.fi-scss.fi:after {
	border-left-color: #d072a1
}

.fi-scss.fi .fi-content {
	background-color: #bf4080;
	color: #fff
}

.fi-sass.fi:before {
	background-color: #b43c78
}

.fi-sass.fi:after {
	border-left-color: #c69
}

.fi-sass.fi .fi-content {
	background-color: #b43c78;
	color: #fff
}

.fi-less.fi:before {
	background-color: #1d365d
}

.fi-less.fi:after {
	border-left-color: #2d5390
}

.fi-less.fi .fi-content {
	background-color: #1d365d;
	color: #fff
}

.fi-jsx.fi:before {
	background-color: #61dafb
}

.fi-jsx.fi:after {
	border-left-color: #a2e9fd
}

.fi-jsx.fi .fi-content {
	background-color: #61dafb;
	color: #222
}

.fi-sh.fi:before {
	background-color: #2a3238
}

.fi-sh.fi:after {
	border-left-color: #46545e
}

.fi-sh.fi .fi-content {
	background-color: #2a3238;
	color: #4da925
}

.fi-pl.fi:before {
	background-color: #028fbd
}

.fi-pl.fi:after {
	border-left-color: #05bffc
}

.fi-pl.fi .fi-content {
	background-color: #028fbd;
	color: #fff
}

.fi-xls.fi:before {
	background-color: #86d44c
}

.fi-xls.fi:after {
	border-left-color: #aae181
}

.fi-xls.fi .fi-content {
	background-color: #86d44c;
	color: #fff
}

.fi-xlsx.fi:before {
	background-color: #6cbf2e
}

.fi-xlsx.fi:after {
	border-left-color: #8ed758
}

.fi-xlsx.fi .fi-content {
	background-color: #6cbf2e;
	color: #fff
}

.fi-xlsm.fi:before {
	background-color: #60ab29
}

.fi-xlsm.fi:after {
	border-left-color: #80d244
}

.fi-xlsm.fi .fi-content {
	background-color: #60ab29;
	color: #fff
}

.fi-ods.fi:before {
	background-color: #0c491e
}

.fi-ods.fi:after {
	border-left-color: #158236
}

.fi-ods.fi .fi-content {
	background-color: #0c491e;
	color: #fff
}

.fi-dll.fi:before {
	background-color: #960a4a
}

.fi-dll.fi:after {
	border-left-color: #d40e69
}

.fi-dll.fi .fi-content {
	background-color: #960a4a;
	color: #fff
}

.fi-bak.fi:before {
	background-color: #058bca
}

.fi-bak.fi:after {
	border-left-color: #18b1f9
}

.fi-bak.fi .fi-content {
	background-color: #058bca;
	color: #fff
}

.fi-ini.fi:before {
	background-color: #0b2955
}

.fi-ini.fi:after {
	border-left-color: #134590
}

.fi-ini.fi .fi-content {
	background-color: #0b2955;
	color: #fff
}

.fi-dmp.fi:before {
	background-color: #1960a2
}

.fi-dmp.fi:after {
	border-left-color: #2282db
}

.fi-dmp.fi .fi-content {
	background-color: #1960a2;
	color: #fff
}

.fi-sys.fi:before {
	background-color: #abe6f1
}

.fi-sys.fi:after {
	border-left-color: #e4f7fa
}

.fi-sys.fi .fi-content {
	background-color: #abe6f1;
	color: #fff
}

.fi-cfg.fi:before {
	background-color: #7fd9ea
}

.fi-cfg.fi:after {
	border-left-color: #b8eaf3
}

.fi-cfg.fi .fi-content {
	background-color: #7fd9ea;
	color: #fff
}

.fi-tmp.fi:before {
	background-color: #69d2e6
}

.fi-tmp.fi:after {
	border-left-color: #a2e3f0
}

.fi-tmp.fi .fi-content {
	background-color: #69d2e6;
	color: #fff
}

.fi-icns.fi:before {
	background-color: #b4e9f2
}

.fi-icns.fi:after {
	border-left-color: #edfafc
}

.fi-icns.fi .fi-content {
	background-color: #b4e9f2;
	color: #222
}

.fi-doc.fi:before {
	background-color: #235d9c
}

.fi-doc.fi:after {
	border-left-color: #317dd1
}

.fi-doc.fi .fi-content {
	background-color: #235d9c;
	color: #fff
}

.fi-docx.fi:before {
	background-color: #2980b9
}

.fi-docx.fi:after {
	border-left-color: #4da1d8
}

.fi-docx.fi .fi-content {
	background-color: #2980b9;
	color: #fff
}

.fi-log.fi:before {
	background-color: #accff3
}

.fi-log.fi:after {
	border-left-color: #e6f0fb
}

.fi-log.fi .fi-content {
	background-color: #accff3;
	color: #fff
}

.fi-txt.fi:before {
	background-color: #8bc6d6
}

.fi-txt.fi:after {
	border-left-color: #bcdee7
}

.fi-txt.fi .fi-content {
	background-color: #8bc6d6;
	color: #fff
}

.fi-pdf.fi:before {
	background-color: #f88e21
}

.fi-pdf.fi:after {
	border-left-color: #faaf61
}

.fi-pdf.fi .fi-content {
	background-color: #f88e21;
	color: #fff
}

.fi-avi.fi:before {
	background-color: #40c1e6
}

.fi-avi.fi:after {
	border-left-color: #7bd4ee
}

.fi-avi.fi .fi-content {
	background-color: #40c1e6;
	color: #fff
}

.fi-mov.fi:before {
	background-color: #ff5838
}

.fi-mov.fi:after {
	border-left-color: #ff907a
}

.fi-mov.fi .fi-content {
	background-color: #ff5838;
	color: #fff
}

.fi-mp4.fi:before {
	background-color: #4163b4
}

.fi-mp4.fi:after {
	border-left-color: #6d89ca
}

.fi-mp4.fi .fi-content {
	background-color: #4163b4;
	color: #fff
}

.fi-wmv.fi:before {
	background-color: #f76205
}

.fi-wmv.fi:after {
	border-left-color: #fb8a43
}

.fi-wmv.fi .fi-content {
	background-color: #f76205;
	color: #fff
}

.fi-mpg.fi:before {
	background-color: #1298d6
}

.fi-mpg.fi:after {
	border-left-color: #3cb6ef
}

.fi-mpg.fi .fi-content {
	background-color: #1298d6;
	color: #fff
}

.fi-mpeg.fi:before {
	background-color: #0e77a7
}

.fi-mpeg.fi:after {
	border-left-color: #13a2e4
}

.fi-mpeg.fi .fi-content {
	background-color: #0e77a7;
	color: #fff
}

.fi-mkv.fi:before {
	background-color: #0c668f
}

.fi-mkv.fi:after {
	border-left-color: #1191cd
}

.fi-mkv.fi .fi-content {
	background-color: #0c668f;
	color: #fff
}

.fi-wps.fi:before {
	background-color: #297eff
}

.fi-wps.fi:after {
	border-left-color: #6ba6ff
}

.fi-wps.fi .fi-content {
	background-color: #297eff;
	color: #fff
}

.fi-exe.fi:before {
	background-color: #0e63ab
}

.fi-exe.fi:after {
	border-left-color: #1386e8
}

.fi-exe.fi .fi-content {
	background-color: #0e63ab;
	color: #fff
}

.fi-size-xs.fi {
	width: 28.8px;
	height: 36.8px;
	padding-top: 8px
}

.fi-size-xs.fi:before {
	right: 8px
}

.fi-size-xs.fi:after {
	border-top-width: 8px;
	border-left-width: 8px
}

.fi-size-xs.fi .fi-content {
	top: 8px;
	padding-top: 13.2px;
	font-size: 10.4px
}

.fi-size-sm.fi {
	width: 36px;
	height: 46px;
	padding-top: 10px
}

.fi-size-sm.fi:before {
	right: 10px
}

.fi-size-sm.fi:after {
	border-top-width: 10px;
	border-left-width: 10px
}

.fi-size-sm.fi .fi-content {
	top: 10px;
	padding-top: 16.5px;
	font-size: 13px
}

.fi-size-md.fi {
	width: 43.2px;
	height: 55.2px;
	padding-top: 12px
}

.fi-size-md.fi:before {
	right: 12px
}

.fi-size-md.fi:after {
	border-top-width: 12px;
	border-left-width: 12px
}

.fi-size-md.fi .fi-content {
	top: 12px;
	padding-top: 19.8px;
	font-size: 15.6px
}

.fi-size-lg.fi {
	width: 54px;
	height: 69px;
	padding-top: 15px
}

.fi-size-lg.fi:before {
	right: 15px
}

.fi-size-lg.fi:after {
	border-top-width: 15px;
	border-left-width: 15px
}

.fi-size-lg.fi .fi-content {
	top: 15px;
	padding-top: 24.75px;
	font-size: 19.5px
}

.fi-size-xl.fi {
	width: 72px;
	height: 92px;
	padding-top: 20px
}

.fi-size-xl.fi:before {
	right: 20px
}

.fi-size-xl.fi:after {
	border-top-width: 20px;
	border-left-width: 20px
}

.fi-size-xl.fi .fi-content {
	top: 20px;
	padding-top: 33px;
	font-size: 26px
}

.fi-content-xs .fi-content {
	font-size: 11px;
	padding-top: 55%
}

.fi-round-sm.fi {
	border-radius: 2px;
	overflow: hidden
}

.fi-round-md.fi {
	border-radius: 4px;
	overflow: hidden
}