html {
	font-family:sans-serif;
	-ms-text-size-adjust:100%;
	-webkit-text-size-adjust:100%
}
body {
	margin:0
}
footer,nav {
	display:block
}
a {
	background-color:transparent
}
a:active,a:hover {
	outline:0
}
h1 {
	font-size:2em;
	margin:.67em 0
}
img {
	border:0
}
code {
	font-family:monospace,monospace;
	font-size:1em
}
button,input,textarea {
	color:inherit;
	font:inherit;
	margin:0
}
button {
	overflow:visible
}
button {
	text-transform:none
}
button,html input[type=button] {
	-webkit-appearance:button;
	cursor:pointer
}
button::-moz-focus-inner,input::-moz-focus-inner {
	border:0;
	padding:0
}
input {
	line-height:normal
}
textarea {
	overflow:auto
}
th {
	padding:0
}
@media print {
	*,:after,:before {
	background:transparent!important;
	box-shadow:none!important;
	color:#000!important;
	text-shadow:none!important
}
a,a:visited {
	text-decoration:underline
}
a[href]:after {
	content:" (" attr(href) ")"
}
img,tr {
	page-break-inside:avoid
}
img {
	max-width:100%!important
}
p {
	orphans:3;
	widows:3
}
.navbar {
	display:none
}
.btn>.caret {
	border-top-color:#000!important
}
}@font-face {
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}
*,:after,:before {
	box-sizing:border-box
}
html {
	font-size:10px;
	-webkit-tap-highlight-color:rgba(0,0,0,0)
}
body {
	background-color:#fff;
	color:#333;
	font-family:Helvetica Neue,Helvetica,Arial,sans-serif;
	font-size:14px;
	line-height:1.42857143
}
button,input,textarea {
	font-family:inherit;
	font-size:inherit;
	line-height:inherit
}
a {
	color:#337ab7;
	text-decoration:none
}
a:focus,a:hover {
	color:#23527c;
	text-decoration:underline
}
a:focus {
	outline:5px auto -webkit-focus-ring-color;
	outline-offset:-2px
}
img {
	vertical-align:middle
}
.sr-only {
	height:1px;
	margin:-1px;
	overflow:hidden;
	padding:0;
	position:absolute;
	width:1px;
	clip:rect(0,0,0,0);
	border:0
}
[role=button] {
	cursor:pointer
}
.h1,h1 {
	color:inherit;
	font-family:inherit;
	font-weight:500;
	line-height:1.1
}
.h1,h1 {
	margin-bottom:10px;
	margin-top:20px
}
.h1,h1 {
	font-size:36px
}
p {
	margin:0 0 10px
}
.text-center {
	text-align:center
}
ol,ul {
	margin-bottom:10px;
	margin-top:0
}
ol ol,ol ul,ul ol,ul ul {
	margin-bottom:0
}
.list-unstyled {
	list-style:none;
	padding-left:0
}
code {
	font-family:Menlo,Monaco,Consolas,Courier New,monospace
}
code {
	background-color:#f9f2f4;
	border-radius:4px;
	color:#c7254e
}
code {
	font-size:90%;
	padding:2px 4px
}
.container {
	margin-left:auto;
	margin-right:auto;
	padding-left:15px;
	padding-right:15px
}
@media (min-width:768px) {
	.container {
	width:750px
}
}@media (min-width:992px) {
	.container {
	width:970px
}
}@media (min-width:1200px) {
	.container {
	width:1170px
}
}.row {
	margin-left:-15px;
	margin-right:-15px
}
.col-md-12,.col-md-6,.col-sm-6 {
	min-height:1px;
	padding-left:15px;
	padding-right:15px;
	position:relative
}
@media (min-width:768px) {
	.col-sm-6 {
	float:left
}
.col-sm-6 {
	width:50%
}
}@media (min-width:992px) {
	.col-md-12,.col-md-6 {
	float:left
}
.col-md-12 {
	width:100%
}
.col-md-6 {
	width:50%
}
}th {
	text-align:left
}
.btn {
	background-image:none;
	border:1px solid transparent;
	border-radius:4px;
	cursor:pointer;
	display:inline-block;
	font-size:14px;
	font-weight:400;
	line-height:1.42857143;
	margin-bottom:0;
	padding:6px 12px;
	text-align:center;
	touch-action:manipulation;
	-webkit-user-select:none;
	-moz-user-select:none;
	user-select:none;
	vertical-align:middle;
	white-space:nowrap
}
.btn.active:focus,.btn:active:focus,.btn:focus {
	outline:5px auto -webkit-focus-ring-color;
	outline-offset:-2px
}
.btn:focus,.btn:hover {
	color:#fff;
	text-decoration:none
}
.btn.active,.btn:active {
	background-image:none;
	box-shadow:inset 0 3px 5px rgba(0,0,0,.125);
	outline:0
}
.collapse {
	display:none
}
.caret {
	border-left:4px solid transparent;
	border-right:4px solid transparent;
	border-top:4px dashed;
	border-top:4px solid\9;
	display:inline-block;
	height:0;
	margin-left:2px;
	vertical-align:middle;
	width:0
}
.dropdown {
	position:relative
}
.dropdown-toggle:focus {
	outline:0
}
.dropdown-menu {
	background-clip:padding-box;
	background-color:#fff;
	border:1px solid #ccc;
	border:1px solid rgba(0,0,0,.15);
	border-radius:4px;
	box-shadow:0 6px 12px rgba(0,0,0,.175);
	display:none;
	float:left;
	font-size:14px;
	left:0;
	list-style:none;
	margin:2px 0 0;
	min-width:160px;
	padding:5px 0;
	position:absolute;
	text-align:left;
	top:100%;
	z-index:1000
}
.dropdown-menu>li>a {
	clear:both;
	color:#333;
	display:block;
	font-weight:400;
	line-height:1.42857143;
	padding:3px 20px;
	white-space:nowrap
}
.dropdown-menu>li>a:focus,.dropdown-menu>li>a:hover {
	background-color:#f5f5f5;
	color:#262626;
	text-decoration:none
}
.dropdown-menu>.active>a,.dropdown-menu>.active>a:focus,.dropdown-menu>.active>a:hover {
	background-color:#337ab7;
	color:#fff;
	outline:0;
	text-decoration:none
}
@media (min-width:768px) {
	.navbar-right .dropdown-menu {
	left:auto;
	right:0
}
}.btn .caret {
	margin-left:0
}
.nav {
	list-style:none;
	margin-bottom:0;
	padding-left:0
}
.nav>li,.nav>li>a {
	display:block;
	position:relative
}
.nav>li>a {
	padding:10px 15px
}
.nav>li>a:focus,.nav>li>a:hover {
	background-color:#eee;
	text-decoration:none
}
.nav>li>a>img {
	max-width:none
}
.navbar {
	border:1px solid transparent;
	margin-bottom:20px;
	min-height:50px;
	position:relative
}
@media (min-width:768px) {
	.navbar {
	border-radius:4px
}
.navbar-header {
	float:left
}
}.navbar-collapse {
	border-top:1px solid transparent;
	box-shadow:inset 0 1px 0 hsla(0,0%,100%,.1);
	overflow-x:visible;
	padding-left:15px;
	padding-right:15px;
	-webkit-overflow-scrolling:touch
}
@media (min-width:768px) {
	.navbar-collapse {
	border-top:0;
	box-shadow:none;
	width:auto
}
.navbar-collapse.collapse {
	display:block!important;
	height:auto!important;
	overflow:visible!important;
	padding-bottom:0
}
.navbar-fixed-top .navbar-collapse {
	padding-left:0;
	padding-right:0
}
}.navbar-fixed-top {
	left:0;
	position:fixed;
	right:0;
	z-index:1030
}
.navbar-fixed-top .navbar-collapse {
	max-height:340px
}
@media (max-device-width:480px) and (orientation:landscape) {
	.navbar-fixed-top .navbar-collapse {
	max-height:200px
}
}@media (min-width:768px) {
	.navbar-fixed-top {
	border-radius:0
}
}.navbar-fixed-top {
	border-width:0 0 1px;
	top:0
}
.container>.navbar-collapse,.container>.navbar-header {
	margin-left:-15px;
	margin-right:-15px
}
@media (min-width:768px) {
	.container>.navbar-collapse,.container>.navbar-header {
	margin-left:0;
	margin-right:0
}
}.navbar-brand {
	float:left;
	font-size:18px;
	height:50px;
	line-height:20px;
	padding:15px
}
.navbar-brand:focus,.navbar-brand:hover {
	text-decoration:none
}
.navbar-brand>img {
	display:block
}
@media (min-width:768px) {
	.navbar>.container .navbar-brand {
	margin-left:-15px
}
}.navbar-toggle {
	background-color:transparent;
	background-image:none;
	border:1px solid transparent;
	border-radius:4px;
	float:right;
	margin-bottom:8px;
	margin-right:15px;
	margin-top:8px;
	padding:9px 10px;
	position:relative
}
.navbar-toggle:focus {
	outline:0
}
.navbar-toggle .icon-bar {
	border-radius:1px;
	display:block;
	height:2px;
	width:22px
}
.navbar-toggle .icon-bar+.icon-bar {
	margin-top:4px
}
@media (min-width:768px) {
	.navbar-toggle {
	display:none
}
}.navbar-nav {
	margin:7.5px -15px
}
.navbar-nav>li>a {
	line-height:20px;
	padding-bottom:10px;
	padding-top:10px
}
@media (min-width:768px) {
	.navbar-nav {
	float:left;
	margin:0
}
.navbar-nav>li {
	float:left
}
.navbar-nav>li>a {
	padding-bottom:15px;
	padding-top:15px
}
}.navbar-nav>li>.dropdown-menu {
	border-top-left-radius:0;
	border-top-right-radius:0;
	margin-top:0
}
@media (min-width:768px) {
	.navbar-right {
	float:right!important;
	margin-right:-15px
}
.navbar-right~.navbar-right {
	margin-right:0
}
}.navbar-default {
	background-color:#f8f8f8;
	border-color:#e7e7e7
}
.navbar-default .navbar-brand {
	color:#333
}
.navbar-default .navbar-brand:focus,.navbar-default .navbar-brand:hover {
	background-color:transparent;
	color:#5e5e5e
}
.navbar-default .navbar-nav>li>a {
	color:#333
}
.navbar-default .navbar-nav>li>a:focus,.navbar-default .navbar-nav>li>a:hover {
	background-color:transparent;
	color:#333
}
.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>.active>a:focus,.navbar-default .navbar-nav>.active>a:hover {
	background-color:#e7e7e7;
	color:#555
}
.navbar-default .navbar-toggle {
	border-color:#ddd
}
.navbar-default .navbar-toggle:focus,.navbar-default .navbar-toggle:hover {
	background-color:#ddd
}
.navbar-default .navbar-toggle .icon-bar {
	background-color:#888
}
.navbar-default .navbar-collapse {
	border-color:#e7e7e7
}
.alert {
	border:1px solid transparent;
	border-radius:4px;
	margin-bottom:20px;
	padding:15px
}
.alert>p,.alert>ul {
	margin-bottom:0
}
.alert>p+p {
	margin-top:5px
}
@keyframes progress-bar-stripes {
	0% {
	background-position:40px 0
}
to {
	background-position:0 0
}
}.panel {
	background-color:#fff;
	border:1px solid transparent;
	border-radius:4px;
	box-shadow:0 1px 1px rgba(0,0,0,.05);
	margin-bottom:20px
}
.panel-body {
	padding:5px
}
.panel-heading {
    background-color: #353d43; 
    color: white;
    padding: 15px 20px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.panel-heading>.dropdown .dropdown-toggle {
	color:inherit
}
.container:after,.container:before,.nav:after,.nav:before,.navbar-collapse:after,.navbar-collapse:before,.navbar-header:after,.navbar-header:before,.navbar:after,.navbar:before,.panel-body:after,.panel-body:before,.row:after,.row:before {
	content:" ";
	display:table
}
.container:after,.nav:after,.navbar-collapse:after,.navbar-header:after,.navbar:after,.panel-body:after,.row:after {
	clear:both
}
body {
	font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
	line-height:1.6;
	color:#333;
	background-color:#f8f9fa;
	padding-top:70px;
	padding-bottom:60px
}
.lang-selector {
	padding:12px 15px
}
.lang-selector select {
	background-color:#444;
	color:#fff;
	border:1px solid #555;
	padding:5px 8px;
	border-radius:4px;
	cursor:pointer
}
.lang-selector select option {
	background-color:#333
}
.panel {
	border:none;
	border-radius:8px;
	box-shadow:0 2px 10px rgba(0,0,0,.05);
	margin-bottom:20px;
	overflow:hidden
}

.word-count {
    margin-top: 5px;
    font-size: 12px;
    color: #757575; 
    text-align: right;
}
.form-textarea {
	width:100%;
	padding:12px 15px;
	border:1px solid #ddd;
	border-radius:4px;
	resize:vertical;
	min-height:100px;
	font-size:16px;
	transition:border-color .3s ease
}
.form-textarea:focus {
	border-color:#4caf50;
	outline:none;
	box-shadow:0 0 0 2px rgba(76,175,80,.2)
}
#font-list {
	padding:0;
	margin:20px 0 0
}
#font-list li {
	border:solid 1px #eee;
	border-radius:6px;
	padding:15px;
	background-color:#fff;
	margin-bottom:10px;
	position:relative;
	transition:all .3s ease
}
#font-list li:hover {
	border-color:#4caf50;
	transform:translateY(-2px);
	box-shadow:0 4px 8px rgba(0,0,0,.05)
}
#font-list li input {
	position:absolute;
	right:15px;
	top:50%;
	transform:translateY(-50%)
}
.font-text {
	padding-right:80px;
	font-size:2rem;
	color:#333;
	word-break:break-word
}
.btn-copyit {
    background-color: #2b3a47; 
    color: white;
    border: none;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}
.btn-copyit:hover {
    background-color: #000; 
}
.tool-note {
	max-width:100%;
	margin:30px auto 0;
	position:relative;
	background:#fffbf3;
	border:1px dotted #ffd08d;
	padding:15px 20px;
	color:#212529;
	border-radius:6px;
	margin-bottom:1.5rem;
	font-size:1.6rem;
	font-weight:400
}
.tool-note .p-right {
	display:flex;
	justify-content:flex-start;
	align-items:flex-start
}
.tool-note .p-right img {
	width:175px;
	margin-left:10px
}
.footer {
	background-color:#333;
	color:#9d9d9d;
	padding:30px 0;
	margin-top:40px
}
.footer p {
	margin:0;
	text-align:center
}
@media (max-width:768px) {
	.font-text {
	font-size:1.2rem;
	padding-right:70px
}
.btn-copyit {
	padding:4px 8px;
	font-size:12px
}
.lang-selector {
	padding:10px 15px;
	border-top:1px solid #444
}
.navbar-nav>li {
	float:none
}
.tool-note {
	font-size:1.4rem
}
.tool-note .p-right {
	display:block
}
.tool-note .p-right img {
	width:100%;
	margin-left:0;
	margin-top:10px
}
}