@font-face {
	font-family: 'Niko';
	src: url('fonts_site/niko-regular.woff2') format('woff2'),
	url('fonts_site/niko-regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Niko';
	src: url('fonts_site/niko-regularitalic.woff2') format('woff2'),
	url('fonts_site/niko-regularitalic.woff') format('woff');
	font-weight: normal;
	font-style: italic;
}

@font-face {
	font-family: 'Niko bold';
	src: url('fonts_site/niko-bold.woff2') format('woff2'),
	url('fonts_site/niko-bold.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Niko bold';
	src: url('fonts_site/niko-bolditalic.woff2') format('woff2'),
	url('fonts_site/niko-bolditalic.woff') format('woff');
	font-weight: normal;
	font-style: italic;
}

html { overflow-y: scroll; }

body {
	font-family: 'Niko', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
	color: #000;
	line-height: 19px;
	font-size: 14px;
}

#lt-header {
    margin-top: 50px;
    display: flex;
    flex-direction: column;
	min-height: 125px;
}

/* -------------------------------------------------------------------------
    Navigation
------------------------------------------------------------------------- */
.main-nav {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

ul#lt-nav {
    list-style-type: none;
    margin: 0;
    font-size: 17px;
    text-transform: uppercase;
	letter-spacing: 0.5px;
}

ul#lt-nav li {
    display: inline;
    margin: 0 0 0 18px;
}

ul#sub-nav {
    list-style-type: none;
    font-size: 16px;
    text-align: right;
    margin: 5px 0 0 0;
    padding-left: 0;
}

ul#sub-nav li {
    display: inline;
    margin: 0 0 0 20px;
}

/* Fontnav */
nav.font-nav a {
    display: block;
    font-size: 14px;
    line-height: 21px;
}

/* FAQ */
.lt-fontnav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.lt-fontnav li {
	line-height: 1.8em;
}

.lt-fontnav a.active,
.lt-fontnav a:hover {
	color: #45c399;
	text-decoration: none;
}

/* -------------------------------------------------------------------------
    Text
------------------------------------------------------------------------- */
h1, h3, h4, strong,
.font-weight-bold {
	font-family: 'Niko bold', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
	font-weight: normal !important;
}

.font-teaser span {
    display: block;
    line-height: 1em;
    text-align: left;
}

.link-container,
.link-container-small {
    display: inline-flex;
    align-items: center;
    margin-bottom: 5px;
}

.link-container a {
    text-transform: uppercase;
    font-size: 16px;
	letter-spacing: 0.5px;
}

.link-container i {
    font-size: 23px;
    margin-right: 10px;
    color: #45c399;
    margin-bottom: 3px;
}

.link-container-small a {
    font-size: 14px;
}

.link-container-small i {
    font-size: 14px;
    margin-right: 5px;
    color: #45c399;
}

hr {
	border-top: 1px solid #000;
	margin-top: 5px;
}

hr.light {
    border-top-color: #bbb;
}

hr.tight {
	border-top: 1px solid #bbb;
	margin-top: 0px;

}

a { color: #000; }

.teaser a,
.content a { text-decoration: underline; }

.btn_toggle_font { line-height: 1.5em; }
a.btn_toggle_font { text-decoration: none; }

a:hover,
a.active {
	color: #45c399;
	text-decoration: none;
}

a.highlight,
i.highlight,
span.highlight { color: #45c399; }

*:focus { outline: none !important; }
*::-moz-focus-outer { border: 0 !important; }

h1.logo {
    font-size: 26px;
    margin: 0;
}

h2 {
    border-bottom: 1px solid #000;
    font-size: 17px;
    text-transform: uppercase;
    padding-bottom: 5px; 
    margin-top: 50px;
	margin-bottom: 1rem;  /*LUDWIG (bootstrap by default 0.5rem)*/
	letter-spacing: 0.5px;
}

h2.noline {
    border-bottom: none;
	margin-bottom: 3px;
}


h3 { font-size: 16px; }

/* FAQ */
h3.lt-teaser-title {
	font-size: inherit;
	line-height: inherit;
	font-family: 'Niko bold', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
	font-weight: normal !important;
	margin: 0;
}

h4 { font-size: 14px; }

h5 { font-size: 14px; }

/*section.opentype h3:not(:first-of-type) { margin-top: 35px; }*/

section.styles h4,
section.characterset h4 {
	font-family: 'Niko', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
    text-transform: uppercase;
    font-weight: normal;
	letter-spacing: 0.5px;
}

section.newsletter img { border: 1px solid black; }

/*section.opentype .svg { margin-top: 2em; }*/
section.opentype hr { 
	border-top: 1px solid #d9dadb;
	/*margin: 2em 0 2em 0;*/
}

.strikethrough { text-decoration: line-through !important; }

.blog-share { font-size: 18px; }

.icon {
    height: 18px;
    margin-right: 10px;
    margin-bottom: 3px;
}

.smaller-icon { 
	height: 16px; 
    margin-right: 5px;
    margin-bottom: 2px;
}

.small-icon { height: 10px; }

.capitalspacing { letter-spacing: 0.5px; }

/* -------------------------------------------------------------------------
    Typeslider
------------------------------------------------------------------------- */
.tt-count {
    float: right;
}

.tt-container {
    overflow: hidden;
}

input.tt-input {
    border: none;
    padding: 0;
	font-size: 13em;
	height: 287px;
    width: 100%;
    line-height: 1.7em;
	margin: 0 0 20px;
}

/* -------------------------------------------------------------------------
    ion.rangeSlider
------------------------------------------------------------------------- */
.irs--round .irs-line {
    height: 1px;
    background-color: #000;
    border-radius: 0;
}

.irs--round .irs-bar {
    height: 1px;
    background-color: #000;
}

.irs--round .irs-handle {
    border: none;
    background-color: #45c399;
    box-shadow: none;
	top: 28px;
    width: 17px;
    height: 17px;
}

.irs--round .irs-handle.state_hover,
.irs--round .irs-handle:hover {
    background-color: #45c399;
}

.irs--round .irs-single {
	font-family: 'Niko', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
    font-size: 17px;
    padding: 3px 6px;
    background-color: #45c399;
    color: #fff;
    border-radius: 0;
    cursor: pointer;
}

.irs--round .irs-single::before {
    border-top-color: #45c399;
}

/* -------------------------------------------------------------------------
    Fontübersicht
------------------------------------------------------------------------- */
.btn_filter,
.btn_collapse,
.btn_reset {
    font-size: 17px;
}

.btn_filter:hover,
.btn_filter.filter-active {
    color: #45c399;
}

.btn_filter.filter-inactive {
    text-decoration: line-through;
}

.fo-font-box hr {
	margin-bottom: 40px;
}

.fo-font-box:hover {
	background-color: rgba(69, 195, 153, 0.1);
}

.fo-input-box {
	overflow: hidden;
	width: 100%;
	height: 160px;
}

input.fo-input {
	border: none;
	padding: 0;
	font-size: 120px; /* Basiswert für Ratio/Skalierung */
	line-height: 1.2em;
	margin: 0;
	background-color: transparent;
    width: 100%;
}

.fo-teaser {
	display: flex;
	justify-content: space-between;
	align-items: center;
    font-size: 16px;
}

.fo-link span.hint {
	color: #45c399;
	font-family: 'Niko bold', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
	font-weight: normal !important;
}

/* -------------------------------------------------------------------------
    Utilities
------------------------------------------------------------------------- */
.hidden { display: none; }
.bg-mint { background-color: rgba(69, 195, 153, 0.1); }
.font-size-12 { font-size: 1.2em; }
.font-size-14 { font-size: 1.4em; }

/* -------------------------------------------------------------------------
    Formulare
------------------------------------------------------------------------- */
.custom-select-sm {
    font-size: 100%;
}

.signal {
	color: #ff6666;
}

/* -------------------------------------------------------------------------
    img rollover effect
------------------------------------------------------------------------- */
.lt-rollover .lt-rollover-hover {
	display: none;
}

.lt-rollover.lt-rollover-active .lt-rollover-hover,
.lt-no-touch .lt-rollover:hover .lt-rollover-hover {
	display: inline;
}

.lt-rollover.lt-rollover-active .lt-rollover-base,
.lt-no-touch .lt-rollover:hover .lt-rollover-base {
	display: none;
}

/* -------------------------------------------------------------------------
    social media buttons
------------------------------------------------------------------------- */
.lt-social div, .lt-social a {
	display: inline-block;
	vertical-align: top;
	position: relative;
	font-size: 0;
}

.lt-social #fb-root { display: none; }
.lt-social .fb-like { margin-right: 15px; }
.lt-social #___plusone_0 { margin-right: 15px !important; }
.lt-social .fb-share-button,
.lt-social .twitter-share-button { margin-right: 15px !important; }

/* -------------------------------------------------------------------------
    Typetester
------------------------------------------------------------------------- */
.typetester .row:hover span {
    background-color: rgba(69, 195, 153, 0.1);
}

.typetester .row:hover span.hint {
    color: #45c399;
}

/* -------------------------------------------------------------------------
    Ludwig
------------------------------------------------------------------------- */
/*Font Awesome*/
.fa-circle{
    color: #45c399;
}

.btn_deselect_all,
.btn_select_all {
    /*color: #45c399;*/
	text-decoration: underline;
	padding-right:10px;
}

.tooltip{
    font-family: 'Niko', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
}

.tooltip-inner {
    max-width: 260px;
    /* If max-width does not work, try using width instead */
    /*width: 260px;*/
}

.featuresoff{
    color: #999;
}

h1 { 
	margin-bottom: 0.3em;
}

h1.space-bottom { 
	margin-bottom: 0.4em;
}

.customtype_subhead{
    font-size: 24px;
	line-height: 1.2em;
}

h1.no-space-bottom { 
	margin-bottom: 0em;
}

.ohneabstand{
	line-height:1em;
}

.mouseoverimg2 {
    display: none;
}
.thumbnail:hover .mouseoverimg1 {
    display: none;
}
.thumbnail:hover .mouseoverimg2 {
    display: block;
}


/* -------------------------------------------------------------------------
    Responsive
------------------------------------------------------------------------- */
.social { text-align: right; }

@media (max-width: 767.98px) {
    .social { text-align: left; }
	
	h1 { line-height: 1.1em; font-size: 2rem;}

    h1.logo { font-size: 20px; }

    ul#lt-nav { padding-left: 0; }

    ul#lt-nav li,
    ul#sub-nav li {
        display: block;
        text-align: right;
        margin-left: 0;
    }
}

@media (max-width: 991.98px) {
    ul#lt-nav { font-size: 15px; }
    ul#sub-nav { font-size: 14px; }
}

/* reverse logic */
.fo-link { font-size: 0.7em; line-height: 1.2em; }

@media (min-width: 420px) {}

/* bootstrap default */
@media (min-width: 576px) {
    .fo-link { font-size: 0.8em;}
}

@media (min-width: 768px) {
    .fo-link { font-size: 1em; }
}

@media (min-width: 992px) {
    .fo-link { font-size: 1em; }
}

@media (min-width: 1200px) {
    .fo-link { font-size: 1em; }
}