﻿@media (prefers-color-scheme: dark)
{
	:root
	{
		/* colors */
		--color-neutral-0: #000000;
		--color-neutral-100: #151515;
		--color-neutral-200: #2a2a2a;
		--color-neutral-300: #555555;
		--color-neutral-400: #767676;
		--color-neutral-500: #aaaaaa;
		--color-neutral-600: #d5d5d5;
		--color-neutral-700: #eaeaea;
		--color-neutral-800: #f5f5f5;
		--color-neutral-1000: #ffffff;
		--color-neutral-opacity-1000-5: #ffffff0d;
		--color-neutral-opacity-1000-10: #ffffff1a;
		--color-green-400: #85ffa1;
		--color-green-600: #007a12;
		--color-red-400: #ff87a3;
		--color-red-600: #d50031;
		--color-blue-focus-480: #0096d6;
		--color-blue-focus-520: #008fcc;
		--color-black: #FFFFFF;
		--color-white: #000000;
		--color-body-bg: var(--color-neutral-100);
		/* images */
		--bg-img-fmh-logo: url(https://cdn1.fmh.de/images/fmh.svg);
		--bg-img-bar-chart-4: url(https://cdn1.fmh.de/images/common/icons/bar-chart-4-dm.svg);
		--bg-img-award: url(https://cdn1.fmh.de/images/fmh/award-dm.svg);
		--bg-img-award-line: url(https://cdn1.fmh.de/images/fmh/award-line-dm.svg);
		--bg-img-chevron-down-select: url(https://cdn1.fmh.de/images/handelsblatt/chevron-down-select-dm.svg);
		--bg-img-gift-fill: url(https://cdn1.fmh.de/images/fmh/gift-fill-dm.svg);
		--bg-img-info-circle: url(https://cdn1.fmh.de/images/handelsblatt/info-circle-dm.svg);
		--bg-img-location-fill: url(https://cdn1.fmh.de/images/fmh/location-fill-dm.svg);
		--bg-img-location-on: url(https://cdn1.fmh.de/images/fmh/location-on-dm.svg);
		--bg-img-question-fill: url(https://cdn1.fmh.de/images/handelsblatt/question-fill-dm.svg);
	}

	div.alfag select option:hover, div.alfag select option:checked
	{
		/*color: var(--color-slate-100);*/
	}
	div.alfag ul.tabs li.active a
	{
		/*background: var(--color-slate-200);*/
	}
	div.alfag ul.tabs li.active a:hover
	{
		/*background: var(--color-slate-100);*/
	}
	div.alfag .submit, div.alfag .button_selected
	{
		/*background: var(--color-slate-200);*/
	}
	div.alfag .submit:hover, div.alfag .button_selected:hover
	{
		/*background: var(--color-slate-100);*/
	}
	div.alfag .angebotlink, div.alfag .dalink, div.alfag .ablaufschritt .anfragebutton
	{
		/*background: var(--color-slate-200);*/
	}
	div.alfag .angebotlink:hover, div.alfag .dalink:hover, div.alfag .ablaufschritt .anfragebutton:hover
	{
		/*background: var(--color-slate-100);*/
	}
	div.alfag .mlink
	{
	}
	div.alfag .mlink:hover
	{
		/*color: var(--color-slate-100);*/
		/*background: var(--color-green-300);*/
	}
	div.alfag .ui-checkboxradio-label.ui-button:hover
	{
		/*color: var(--color-white-permanent);*/
	}
}

@media (max-width: 940px)
{
	div.alfag .schnellcheck-buttonset table, div.alfag .schnellcheck-buttonset tbody, div.alfag .schnellcheck-buttonset tr
	{
		display: block;
	}
	div.alfag .schnellcheck-buttonset td, div.alfag .schnellcheck-buttonset th
	{
		display: inline-block;
		width: 15%;
	}
	div.alfag .schnellcheck-buttonset th:nth-child(1)
	{
		width: 100%;
		padding: 4px;
	}
	div.alfag .schnellcheck-buttonset .plz th:nth-child(1), div.alfag .schnellcheck-buttonset .plz td:nth-child(2)
	{
		width: 100%;
	}
	div.alfag .schnellcheck-buttonset .plz th:nth-child(3), div.alfag .schnellcheck-buttonset .plz th:nth-child(4)
	{
		width: 45%;
		text-align: left !important;
	}
}

@media (max-width: 840px)
{
	div.alfag .resulttable .col-award
	{
		display: none;
	}
	div.alfag .resulttable .col-sollzins
	{
		display: none;
	}
	div.alfag .resulttable .col-zinskosten
	{
		display: none;
	}
	
	div.alfag .fmh-bonus-banner
	{
		width: 70%;
	}
}

@media (max-width: 740px)
{
	div.alfag *
	{
		-webkit-text-size-adjust: none;
	}

	div.alfag ul.tabs li
	{
		width: 45%;
	}

	div.alfag .resulttable .col-restschuld
	{
		display: none;
	}
	div.alfag.kfw-top-anbieter .resulttable .col-sollzins-hypo
	{
		display: none;
	}
	
	div.alfag .basiszinsangaben
	{
		width: 50%;
		position: static;
		left: 10px;
		margin: 10px auto;
	}
		
	div.alfag .rpnl
	{
		float: none;
		width: 100%;
	}
	div.alfag .rbox
	{
		float: none;
		width: 50%;
		margin: 10px auto;
	}
	
	div.alfag .fmh-bonus-banner
	{
		width: 80%;
	}
}

@media (max-width: 640px)
{
	:root
	{
		/*  */
		--font-size-h1: 32px;
		--font-size-h2: 28px;
		--font-size-h3: 26px;
		--font-size-h4: 22px;
		--font-size-h5: 20px;
		--font-size-h6: 18px;
	}

	div.alfag ul.tabs
	{
		width: 80%;
	}
	div.alfag ul.tabs li
	{
		width: 100%;
	}
	
	div.alfag .rb, div.alfag .cb
	{
		white-space: normal;
	}

	div.alfag fieldset li
	{
		width: 100%;
	}
	div.alfag fieldset li.hl, div.alfag fieldset li.cs3
	{
		width: 100%;
	}
	div.alfag fieldset li.hl, div.alfag fieldset li.hl a
	{
		font-weight: bold;
	}

	div.alfag.schnellcheck .schnellcheck-buttonset .darlehensbetrag td:nth-child(2),
	div.alfag.schnellcheck .schnellcheck-buttonset .beleihung td:nth-child(2),
	div.alfag.schnellcheck .schnellcheck-buttonset .tilgung td:nth-child(2),
	div.alfag.schnellcheck .schnellcheck-buttonset .sollzinsbindung td:nth-child(2)
	{
		/*display: none;*/
	}
	div.alfag .schnellcheck-buttonset .darlehensbetrag td:nth-child(5),
	div.alfag .schnellcheck-buttonset .beleihung td:nth-child(4),
	div.alfag .schnellcheck-buttonset .tilgung td:nth-child(5),
	div.alfag .schnellcheck-buttonset .sollzinsbindung td:nth-child(6)
	{
		/*display: none;*/
	}
	div.alfag .schnellcheck-buttonset table, div.alfag .schnellcheck-buttonset tbody, div.alfag .schnellcheck-buttonset tr
	{
		display: block;
	}
	div.alfag .schnellcheck-buttonset td, div.alfag .schnellcheck-buttonset th
	{
		display: inline-block;
		width: 24%;
	}
	div.alfag .schnellcheck-buttonset th:nth-child(1)
	{
		width: 100%;
		padding: 4px;
	}
	div.alfag .schnellcheck-buttonset .plz th:nth-child(2), div.alfag .schnellcheck-buttonset .plz th:nth-child(4)
	{
		width: 40%;
		text-align: left !important;
	}
		
	div.alfag.schnellcheck .resulttable .col-sollzins
	{
		display: none;
	}
	div.alfag.top-anbieter .resulttable .col-sollzins
	{
		display: none;
	}
	div.alfag.kfw-top-anbieter .resulttable .col-verlauf
	{
		display: none;
	}
	
	div.alfag .ltcol2
	{
		width: 100%;
	}
	
	div.alfag .anbieter-details-tab table, div.alfag .anbieter-details-tab tbody, div.alfag .anbieter-details-tab tr
	{
		display: block;
	}
	div.alfag .anbieter-details-tab td, div.alfag .anbieter-details-tab th
	{
		display: inline-block;
	}
	div.alfag .anbieter-details-tab th:nth-child(1), div.alfag .anbieter-details-tab th:nth-child(3)
	{
		width: 50%;
	}
	div.alfag .anbieter-details-tab td:nth-child(2), div.alfag .anbieter-details-tab td:nth-child(4)
	{
		width: 45%;
	}
	div.alfag .anbieter-details-tab td.bemerkung
	{
		width: 100%;
	}
	
	div.alfag .anbieter-details-tab .bemerkungsrow th, div.alfag .anbieter-details-tab .bemerkungsrow td
	{
		width: 100%;
	}
	
	div.alfag .basiszinsangaben
	{
		width: 60%;
	}
	
	div.alfag .institutdetails-details
	{
		width: 100%;
	}
	div.alfag .institutdetails-auszeichnung
	{
		display: none;
	}
	
	div.alfag.kfw-programme .resulttable table, div.alfag.kfw-programme .resulttable tbody, div.alfag.kfw-programme .resulttable tr
	{
		display: block;
	}
	div.alfag.kfw-programme .resulttable td, div.alfag.kfw-programme .resulttable th
	{
		display: inline-block;
		width: 30%;
	}
	div.alfag.kfw-programme .resulttable .al
	{
		text-align: center;
	}
	div.alfag.kfw-programme .resulttable .kfwprogrammrow td, div.alfag.kfw-programme .resulttable .kfwprogrammrow th
	{
		width: 100%;
		text-align: left;
	}
	div.alfag.kfw-programme .resulttable .datarow3 td, div.alfag.kfw-programme .resulttable .datarow3 th
	{
		width: 100%;
		text-align: left;
	}
	div.alfag.kfw-programme .resulttable .headerrow td, div.alfag.kfw-programme .resulttable .headerrow th
	{
		background-color: #FFFFFF;
	}
	div.alfag.kfw-programme .resulttable .datarow1, div.alfag.kfw-programme .resulttable .datarow1
	{
		margin-bottom: 12px;
	}
		
	div.alfag .anbieter-details-tab .ablauffmhbonus td:nth-child(2)
	{
		width: 90%;
	}
	
	div.alfag .rbox
	{
		width: 60%;
	}
	
	div.alfag .fmh-bonus-banner
	{
		width: 90%;
	}
	
}

@media (max-width: 560px)
{
	div.alfag fieldset li:nth-child(1), div.alfag fieldset li:nth-child(3)
	{
		width: 100%;
	}
	div.alfag fieldset li:nth-child(2), div.alfag fieldset li:nth-child(4)
	{
		width: 100%;
	}
	
		
	div.alfag ul.tabs li
	{
		width: 100%;
	}
	div.alfag ul.tabs li a
	{
		text-align: center;
	}
	div.alfag.detail-analyse ul.tabs li
	{
		width: 100%;
	}
	
	div.alfag .schnellcheck-buttonset-header
	{
		display: block;
		text-align: center;
	}
	div.alfag .schnellcheck-buttonset
	{
		display: none;
	}
	
	div.alfag .schnellcheck-buttonset td, div.alfag .schnellcheck-buttonset th
	{
		width: 32%;
	}
	
	div.alfag .schnellcheck-buttonset .plz th, div.alfag .schnellcheck-buttonset .plz td
	{
		width: 100% !important;
		text-align: left !important;
	}
	div.alfag .schnellcheck-buttonset .plz td:nth-child(5)
	{
		display: none;
	}
	
	div.alfag.schnellcheck .resulttable .col-fmh-bonus
	{
		display: none;
	}	
	div.alfag.schnellcheck .resulttable .col-restschuld
	{
		display: none;
	}
	div.alfag.top-anbieter .resulttable .col-restschuld
	{
		display: none;
	}
	div.alfag.kfw-top-anbieter .resulttable .col-effektivzins-kfw124, div.alfag.kfw-top-anbieter .resulttable .col-effektivzins-kfw153, div.alfag.kfw-top-anbieter .resulttable .col-effektivzins-kfw261,
	div.alfag.kfw-top-anbieter .resulttable .col-effektivzins-kfw297, div.alfag.kfw-top-anbieter .resulttable .col-effektivzins-kfw298
	{
		display: none;
	}
		
	div.alfag .inputs, div.alfag .inputs tbody, div.alfag .inputs tr
	{
		display: block;
	}
	div.alfag .inputs td
	{
		display: inline-block;
		width: 45%;
	}
	
	div.alfag #fsKfwDarlehen li.cs2
	{
		width: 100%;
	}
	
	div.alfag #pnlInputButtons fieldset li.hl
	{
		width: 55%;
	}
	
	div.alfag .award
	{
		display: none;
	}
	
	div.alfag #pnlWohnriesterDarlehenRedirect
	{
		display: none;
	}
	
	div.alfag .basiszinsangaben
	{
		width: 70%;
	}
	
	div.alfag .rbox
	{
		width: 70%;
	}
	
	div.alfag .anbieter-details-tabs li
	{
		min-width: 50%;
	}
	
	div.alfag .fmh-bonus-banner
	{
		width: 100%;
	}
	div.alfag .fmh-bonus-banner-layer3
	{
		margin: 0px;
	}
	div.alfag .fmh-bonus-banner-layer4
	{
		margin: -22px;
	}
	div.alfag .fmh-bonus-banner-text-content
	{
		padding: 40px;
	}
	div.alfag .fmh-bonus-banner h3
	{
		font-size: 16px;
	}
	div.alfag .fmh-bonus-banner h3 span
	{
		font-size: 28px;
		letter-spacing: 0;
		padding: 0;
	}
	div.alfag .fmh-bonus-banner-xbtn
	{
		bottom: 3px;
		right: 6px;
	}
	
	div.alfag .hinweis-detail-analyse
	{
		float: none;
		margin: 10px 0;
	}
}

@media (max-width: 480px)
{
	div.alfag .printlink
	{
		display: none;
	}

	div.alfag ul.tabs
	{
		width: 100%;
	}
	div.alfag ul.tabs li
	{
		width: 100%;
	}
	
	div.alfag .schnellcheck-buttonset .tb, div.alfag .schnellcheck-buttonset .sb, 
	div.alfag .schnellcheck-buttonset .button, div.alfag .schnellcheck-buttonset .button_selected, 
	div.alfag .schnellcheck-buttonset .rb, div.alfag .schnellcheck-buttonset .cb
	{
		/*height: 32px;*/
	}
	/*
	div.alfag .schnellcheck-buttonset .plz th:nth-child(2), div.alfag .schnellcheck-buttonset .plz th:nth-child(4)
	{
		width: 60%;
	}
	div.alfag .schnellcheck-buttonset .plz td:nth-child(3), div.alfag .schnellcheck-buttonset .plz td:nth-child(5)
	{
		width: 30%;
	}
	*/
	div.alfag.detail-analyse fieldset table, div.alfag.detail-analyse fieldset tbody, div.alfag.detail-analyse fieldset tr
	{
		display: block;
	}
	div.alfag.detail-analyse fieldset td, div.alfag.detail-analyse fieldset th
	{
		display: inline-block;
		width: 100%;
	}
	div.alfag.detail-analyse .tb, div.alfag.detail-analyse .sb, div.alfag.detail-analyse .sb2
	{
		/*width: 30%;*/
		margin: 2px 0;
	}
		
	div.alfag fieldset input.submit
	{
		/*width: 50%;*/
	}
	div.alfag .sb2
	{
		/*float: none;*/
	}
	
	div.alfag .headerrow th, div.alfag .headerrow td
	{
		white-space: normal;
	}
	
	div.alfag.top-anbieter .resulttable .col-angebot
	{
		/*display: none;*/
	}
	div.alfag.schnellcheck .resulttable .col-angebot
	{
		/*display: none;*/
	}
	div.alfag.kfw-top-anbieter .resulttable .col-angebot
	{
		/*display: none;*/
	}
	
	div.alfag.anbieter-details #tblBasiszinsangaben.tblresult th:nth-child(5), div.alfag.anbieter-details #tblBasiszinsangaben.tblresult td:nth-child(5)
	{
		display: none;
	}
	
	div.alfag .basiszinsangaben
	{
		width: 80%;
	}
	
	div.alfag .resulttable .col-monatsrate
	{
		display: none;
	}
	div.alfag.kfw-programme .resulttable td, div.alfag.kfw-programme .resulttable th
	{
		display: inline-block;
		width: 45%;
	}

	div.alfag .anbieter-details-tabs li
	{
		min-width: 100%;
	}
	
	div.alfag .rbox
	{
		width: 80%;
	}

	div.alfag .fmh-bonus-banner-layer2
	{
		background: none;
	}

	div.alfag .dlink
	{
		white-space: normal;
	}
	div.alfag .angebotlink
	{
		white-space: normal;
	}

	div.alfag .dalink
	{
		display: block;
		float: none;
		width: 90%;
		margin: 0 auto;
		white-space: nowrap;
		text-align: center;
	}
}

@media (max-width: 400px)
{
	div.alfag input, div.alfag select,
	div.alfag .schnellcheck-buttonset .rb label, div.alfag .schnellcheck-buttonset .cb label,
	div.alfag fieldset li span
	{
		font-size: var(--font-size-small);
	}
	
	div.alfag .anbieter-details-tabs li
	{
		width: 100%;
	}
	div.alfag .anbieter-details-tab th, div.alfag .anbieter-details-tab td
	{
		width: 100% !important;
	}

	div.alfag .infolink img
	{
		width: 90px !important;
		height: 30px !important;
	}
	
	div.alfag .dlink
	{
		font-size: 14px;
		white-space: normal;
	}
	div.alfag .angebotlink
	{
		font-size: var(--font-size-small);
		white-space: normal;
	}
	
	div.alfag .rbox
	{
		width: 90%;
	}

	div.alfag table.institutdetails-details, div.alfag table.institutdetails-details tbody, div.alfag table.institutdetails-details tr
	{
		display: block;
	}
	div.alfag table.institutdetails-details th, div.alfag table.institutdetails-details td
	{
		display: inline-block;
		width: 100%;
	}
}

@media (max-width: 380px)
{
	div.alfag.top-anbieter .resulttable .col-monatsrate
	{
		display: none;
	}
	div.alfag.schnellcheck .resulttable .col-monatsrate
	{
		display: none;
	}
	div.alfag.kfw-top-anbieter .resulttable .col-monatsrate
	{
		display: none;
	}
}