html > body > main > section.cigarette > a, html > body > main > section.mortgage-calculator > div.bank-card > details > summary, html > body > main > section.mortgage-calculator > div.sidebar > details > summary
{

	position: relative;
	z-index: 1;
	
	display: inline-block;
	overflow: hidden;
	
	box-sizing: border-box;
	height: 56px;
	padding: 0 32px;
	margin: 0;
	
	font-size: 16px;
	font-weight: 700;
	line-height: 56px;
	white-space: nowrap;
	text-align: center;
	
	-webkit-appearance: none;
	
	   -moz-appearance: none;
	
	        appearance: none;
	
	color: white;
	background: #1b8b80;
	
	border: none;
	border-radius: 28px;
	box-shadow: 16px 0 20px rgba( 86, 63, 0, 0.08 );
}

	html > body > main > section.cigarette > a:not([disabled]), html > body > main > section.mortgage-calculator > div.bank-card > details > summary:not([disabled]), html > body > main > section.mortgage-calculator > div.sidebar > details > summary:not([disabled])
	{
		cursor: pointer;
	}

	html > body > main > section.cigarette > a:not([disabled]):focus::before, html > body > main > section.cigarette > a:not([disabled]):hover::before, html > body > main > section.mortgage-calculator > div.bank-card > details > summary:not([disabled]):focus::before, html > body > main > section.mortgage-calculator > div.bank-card > details > summary:not([disabled]):hover::before, html > body > main > section.mortgage-calculator > div.sidebar > details > summary:not([disabled]):focus::before, html > body > main > section.mortgage-calculator > div.sidebar > details > summary:not([disabled]):hover::before
			{
				-webkit-transform: translateY( 0 );
				        transform: translateY( 0 );
			}

	html > body > main > section.cigarette > a::before, html > body > main > section.mortgage-calculator > div.bank-card > details > summary::before, html > body > main > section.mortgage-calculator > div.sidebar > details > summary::before
	{
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: -1;

		width: 100%;
		height: 100%;

		content: '';

		background: #072b31;

		border-radius: 28px;

		-webkit-transform: translateY( 100% );

		        transform: translateY( 100% );

		transition: -webkit-transform 0.25s;

		transition: transform 0.25s;

		transition: transform 0.25s, -webkit-transform 0.25s;
	}

/**
 * Сбросить всё оформление со стандартной кнопки
 */
html > body > header > div.info > h1, html > body > main > section.banks > h2
{
	margin: 0 0 24px;
	
	font-family: "Circe",sans-serif;
	font-size: 44px;
	font-weight: 400;
	line-height: 1.09;
}
/**
 * Сбросить оформление с details и скрыть контент
 */
html > body > main > section.mortgage-calculator > div.sidebar > details > summary
{
	
	line-height: 50px;
	
	color: white;
	background: transparent;
	
	border: 1px solid white;
	box-shadow: inset 0 0 0 1px white;
}
html > body > main > section.mortgage-calculator > div.sidebar > details > summary:not([disabled]):hover, html > body > main > section.mortgage-calculator > div.sidebar > details > summary:not([disabled]):focus
	{
		color: #072b31;
	}
html > body > main > section.mortgage-calculator > div.sidebar > details > summary::before
	{
		background: white;
	}
html > body > main > section.mortgage-calculator > div.bank-card > details > summary
{

	color: #1b8b80;
	background: white;

	transition:
		color 0.3s,
		background 0.3s;
}
html > body > main > section.mortgage-calculator > div.bank-card > details > summary:hover
	{
		color: white;
	}

html > body > main > section.mortgage-calculator > h2
{
	position: relative;
	
	padding-bottom: 20px;
}

html > body > main > section.mortgage-calculator > h2::before
	{
		position: absolute;
		bottom: 0;
		left: 0;

		width: 122px;
		height: 3px;

		content: '';

		background: linear-gradient( to right, #1b8b80 57%, #84e9d6 57%, #84e9d6 83%, #072b31 83% );
	}
@supports (display: grid)
	{
	}

@supports (display: grid)
	{
		
		@media (max-width: 1099px)
		{
		}
	}

html
{
	scroll-behavior: smooth;
}

html > body > header
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;

	min-height: 640px;
	margin-left: 70px;

	background: url( 'images/bg-petals.svg' ) 30% top no-repeat #072b31;
	background-size: auto 80%;
}

html > body > header > div.info, html > body > header > figure
	{
		-webkit-flex-shrink: 0;
		    -ms-flex-negative: 0;
		        flex-shrink: 0;
		width: 50%;
	}

html > body > main
{
	margin-left: 70px;
}

html > body > main > section.environment
{
	padding-top: 120px;
}

html > body > main > section.environment > div.slideshow::before
		{
			right: calc(-6.25vw - -4px);
		}

html > body > main > section.environment > div.slideshow > div.sections > section
		{
			top: 0;

			padding-top: 55px;
		}

html > body > main > section.subscribe
{
	margin-top: 0;
}

html > body > header > div.info
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
	
	box-sizing: border-box;
	padding: 148px 80px 76px calc(6.25vw - 4px);
}

html > body > header > div.info > h1, html > body > header > div.info > p
	{
		width: calc(25vw - 18px);
	}

html > body > header > div.info > h1
{

	margin-bottom: 16px;

	color: white;
}

html > body > header > div.info > p
{
	margin: 0 0 48px;

	font-size: 20px;
	line-height: 1.5;

	color: white;
}

html > body > header > figure
{
	position: relative;

	margin: 0;
}

html > body > header > figure > img
{
	position: absolute;
	top: 0;
	left: 0;

	width: 100%;
	height: 100%;

	object-fit: cover;
}

html > body > main > section.cigarette
{
	margin-top: 120px;
	
	background: #f5f5f5;
}

html > body > main > section.cigarette::after
	{
		display: table;
		clear: both;

		content: '';
	}

html > body > main > section.cigarette > h2, html > body > main > section.cigarette > a
	{
		margin-left: calc(12.5vw - 9px);
	}

html > body > main > section.cigarette > a
{

	display: inline-block;

	margin-bottom: 24px;

	text-decoration: none;
}

html > body > main > section.cigarette > h2
{
	width: calc(31.25vw - 22px);
	padding: 140px 0 0;
	margin-bottom: 24px;
}

html > body > main > section.cigarette > h2::before
	{
		content: none;
	}

html > body > main > section.banks
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	        flex-wrap: wrap;
	-webkit-justify-content: space-between;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	
	width: calc(100% - 10vw);
	max-width: 760px;
	padding-top: 120px;
	margin: 0 auto;
}

html > body > main > section.banks > aside
{
	position: relative;

	display: -webkit-flex;

	display: -ms-flexbox;

	display: flex;
	-webkit-align-items: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 20px;
	-webkit-align-self: flex-start;
	    -ms-flex-item-align: start;
	        align-self: flex-start;
	
	width: 260px;

	font-size: 15px;
	line-height: 1.47;

	color: rgb(131, 149, 152);
}

html > body > main > section.banks > aside.info::before
		{
			background-image: url( "data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='%23d3d3d3'%3E%3Cg fill-rule='evenodd'%3E%3Cpath fill-rule='nonzero' d='M16 0C7.163 0 0 7.164 0 16c0 8.835 7.164 16 16 16 8.835 0 16-7.165 16-16 0-8.836-7.165-16-16-16zm3.33 24.797c-.824.325-1.48.571-1.97.742-.491.17-1.061.256-1.71.256-.997 0-1.773-.244-2.326-.73-.552-.486-.827-1.103-.827-1.852 0-.29.02-.589.06-.892.043-.304.109-.645.2-1.028l1.03-3.641c.091-.35.17-.682.232-.99a4.39 4.39 0 00.092-.858c0-.463-.096-.788-.287-.97-.194-.184-.558-.273-1.101-.273-.266 0-.54.04-.82.122-.277.085-.518.162-.716.238l.272-1.121c.675-.275 1.32-.511 1.937-.706a5.722 5.722 0 011.747-.295c.99 0 1.754.24 2.292.718.535.478.805 1.1.805 1.863 0 .159-.02.438-.056.836-.036.4-.106.764-.206 1.099l-1.025 3.63a10.27 10.27 0 00-.226.997 5.271 5.271 0 00-.1.847c0 .483.108.812.325.986.214.175.589.263 1.12.263.25 0 .53-.044.848-.131.314-.087.541-.164.685-.23l-.275 1.12zm-.181-14.734a2.447 2.447 0 01-1.727.666 2.473 2.473 0 01-1.734-.666c-.48-.445-.722-.985-.722-1.616 0-.63.244-1.172.722-1.62a2.455 2.455 0 011.734-.674c.673 0 1.25.224 1.727.674.478.448.717.99.717 1.62 0 .632-.24 1.171-.717 1.616z'/%3E%3C/g%3E%3C/svg%3E" );
		}

html > body > main > section.banks > aside::before
	{
		-webkit-flex-shrink: 0;
		    -ms-flex-negative: 0;
		        flex-shrink: 0;
		width: 60px;
		height: 60px;

		content: '';

		background-position: center center;
		background-repeat: no-repeat;
		background-color: white;
		
		border-radius: 50%;
		box-shadow: 0 2px 10px 0 rgba( 0, 0, 0, 0.15 );
	}

html > body > main > section.banks > h2
{
	
	width: 50%;
}

html > body > main > section.banks > p
{
	width: 100%;
}

html > body > main > section.mortgage-calculator
{
	padding-top: 120px;
	margin: 0 calc(6.25vw - 4px);
}

html > body > main > section.mortgage-calculator::after
	{
		display: table;
		clear: both;

		content: '';
	}

html > body > main > section.mortgage-calculator > details
{
	display: none;
}

html > body > main > section.mortgage-calculator > div.empty
{
	padding: 24px;
	margin-top: 24px;
	margin-left: calc(25vw + 6px);

	text-align: center;

	background: #f5f5f5;

	border-radius: 4px;
}

html > body > main > section.mortgage-calculator > div.empty > h3, html > body > main > section.mortgage-calculator > div.empty > p
	{
		margin: 0;
	}

html > body > main > section.mortgage-calculator > div.empty > p
	{
		margin-top: 8px;
	}

html > body > main > section.mortgage-calculator > h2
{

	width: 100%;
}

html > body > main > section.mortgage-calculator > h2::before
	{
		width: 324px;
	}

html > body > main > section.mortgage-calculator > input
{
	display: none;
}

html > body > main > section.mortgage-calculator > input:checked + div.bank-card
		{
			display: -webkit-flex;
			display: -ms-flexbox;
			display: flex;
		}

html > body > header > div.info > ul
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr 1.5fr;
	gap: 16px;

	-webkit-flex-grow: 1;

	    -ms-flex-positive: 1;

	        flex-grow: 1;
	max-width: 600px;
	padding: 0;
	margin: 0;

	list-style: none;
}

html > body > main > section.cigarette > picture
{
	float: right;

	margin-left: 60px;

	font-size: 0;
}

html > body > main > section.cigarette > picture > img
{
	max-width: 765px;
	max-height: 450px;
	
	font-size: 16px;
}

html > body > main > section.mortgage-calculator > div.bank-card
{
	display: none;
	-webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	        flex-wrap: wrap;
	-webkit-justify-content: space-between;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-align-items: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 24px;

	padding: 24px 32px;
	margin: 24px 0 0 calc(25vw + 6px);

	background: #f5f5f5;

	border-radius: 4px;
}

html > body > main > section.mortgage-calculator > div.bank-card > input
{
	display: none;
}

html > body > main > section.mortgage-calculator > div.bank-card > input:checked + ul.programs > li:not(:nth-child( -n + 2 )):not(.last)
				{
					display: block;
				}

html > body > main > section.mortgage-calculator > div.bank-card > input:checked + ul.programs > li.last > label 
					{
						padding-right: 16px;
					}

html > body > main > section.mortgage-calculator > div.bank-card > input:checked + ul.programs > li.last > label > p
						{
							font-size: 0;
						}

html > body > main > section.mortgage-calculator > div.bank-card > input:checked + ul.programs > li.last > label > p::before
							{
								font-size: 17px;

								content: 'Свернуть список программ';
							}

html > body > main > section.mortgage-calculator > div.bank-card > input:checked + ul.programs > li.last > label > p::after
							{
								top: 22px;
								
								-webkit-transform: rotate( -45deg );
								
								        transform: rotate( -45deg );
							}

html > body > main > section.mortgage-calculator > div.bank-card > p.note
{
	-webkit-align-self: flex-end;
	    -ms-flex-item-align: end;
	        align-self: flex-end;
	
	margin: 0;

	font-size: 14px;
	line-height: 1.5;

	color: rgba(7, 43, 49, 0.5);
}

html > body > main > section.mortgage-calculator > div.banks-slider
{
	position: relative;
	
	margin-bottom: 8px;
}

html > body > main > section.mortgage-calculator > div.sidebar
{
	position: absolute;
	
	width: calc(33.33% - 21px);
}

html > body > main > section.mortgage-calculator > div.sidebar.fixed
	{
		position: fixed;
		top: 24px;
	}

html > body > main > section.mortgage-calculator > div.sidebar.at-bottom
	{
		bottom: 0;
	}

html > body > main > section.mortgage-calculator > form
{
	position: -webkit-sticky;
	position: sticky;
	top: 12px;
	
	display: -webkit-flex;
	
	display: -ms-flexbox;
	
	display: flex;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 12px;
	float: left;

	width: calc(25vw - 18px);
}

html > body > main > section.mortgage-calculator > form.promo > div.select.program-types > button.promo-programs
		{
			background-image: url( 'images/star-full.svg' );
		}

html > body > main > section.mortgage-calculator > form.promo > div.range-one > div.input > span.input::before
		{
			content: none;
		}

html > body > main > section.mortgage-calculator > form.promo ~ div.bank-card > p.cost
		{
			display: none;
		}

html > body > main > section.mortgage-calculator > form > div.cost
{
	margin-bottom: 40px;
	
	font-weight: 700;
}

html > body > main > section.mortgage-calculator > form > div.cost > strong
	{
		display: block;

		margin-top: 15px;
		
		font-weight: 400;
	}

html > body > main > section.mortgage-calculator > ul.banks
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	        flex-wrap: wrap;
	-webkit-justify-content: space-between;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-align-items: flex-start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	
	padding: 0 0 0 calc(33.33% + 11px);
	margin: 0;

	list-style: none;
}

html > body > main > section.mortgage-calculator > ul.banks[data-valid-banks='0'] > li.empty
		{
			display: block;
		}

html > body > header > div.info > ul > li:not(:first-child) > a
	{
		-webkit-align-items: center;
		    -ms-flex-align: center;
		        align-items: center;
		
		padding: 16px 96px 16px 24px;
	}

html > body > header > div.info > ul > li:not(:first-child) > a > svg
		{
			bottom: 0;
		}

html > body > header > div.info > ul > li:first-child
	{
		grid-row: span 2;
	}

html > body > header > div.info > ul > li:first-child > a
		{
			-webkit-flex-direction: column;
			    -ms-flex-direction: column;
			        flex-direction: column;
			-webkit-justify-content: space-between;
			    -ms-flex-pack: justify;
			        justify-content: space-between;
			
			padding: 24px 80px 12px 24px;
		}

html > body > header > div.info > ul > li:first-child > a > span
			{
				display: -webkit-flex;
				display: -ms-flexbox;
				display: flex;
				-webkit-align-items: center;
				    -ms-flex-align: center;
				        align-items: center;
				gap: 4px;

				font-size: 20px;
				line-height: 1.5;
			}

html > body > header > div.info > ul > li:first-child > a > span::after
				{
					width: 40px;
					height: 40px;
					margin: 0 -40px 0 4px;
		
					content: '';
		
					background: url( 'images/mortgage/arrow.svg' ) center center no-repeat;
				}

html > body > header > div.info > ul > li:first-child > a > svg
			{
				top: 0;
			}

html > body > header > div.info > ul > li > a
{
	position: relative;
	
	display: -webkit-flex;
	
	display: -ms-flexbox;
	
	display: flex;

	box-sizing: border-box;
	height: 100%;

	font-size: 17px;
	line-height: 1.29;
	text-decoration: none;
	text-wrap: balance;

	color: white;
	background: rgba(255, 255, 255, 0.1);

	border-radius: 4px;

	transition: background 0.2s;
}

html > body > header > div.info > ul > li > a:hover
	{
		background-color: rgba(255, 255, 255, 0.2);
	}

html > body > header > div.info > ul > li > a > svg
	{
		position: absolute;
		right: 0;
	}

html > body > main > section.mortgage-calculator > div.bank-card > details
{
	-webkit-order: 1;
	    -ms-flex-order: 1;
	        order: 1;
}

html > body > main > section.mortgage-calculator > div.bank-card > details > summary
{
	
	list-style: none;

	color: white;
	background-color: #1b8b80;
}

html > body > main > section.mortgage-calculator > div.bank-card > h3
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-align-items: center;
	    -ms-flex-align: center;
	        align-items: center;
	float: left;

	margin: 0;

	font-size: 17px;
	line-height: 2.35;
}

html > body > main > section.mortgage-calculator > div.bank-card > h3 > img
{
	width: 44px;
	height: 44px;
	margin-right: 8px;

	
}

html > body > main > section.mortgage-calculator > div.bank-card > p.cost
{
	margin: 0 0 0 auto;

	font-size: 14px;
	line-height: 1.21;
	text-align: right;

	color: rgba(7, 43, 49, 0.7);
}

html > body > main > section.mortgage-calculator > div.bank-card > p.cost > strong
{
	display: block;

	margin-top: 4px;

	font-size: 17px;
	line-height: 1.18;

	color: #072b31;
}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program
{
	width: 100%;
	
	border-collapse: collapse;
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 4px;
	
	width: 100%;
	padding: 0;
	margin: 0;

	list-style: none;
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs[data-items="3"] > li:not(:nth-child( -n + 4 )):not(.last)
			{
				display: block;
			}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs[data-items="3"] > li.last
			{
				display: none;
			}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs::after
	{
		-webkit-flex-shrink: 0;
		    -ms-flex-negative: 0;
		        flex-shrink: 0;
		width: 5vw;
	}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container
{
	overflow: hidden;
}

html > body > main > section.mortgage-calculator > div.banks-slider > ul.buttons
{
	height: 0;
	padding: 0;
	margin: 0;

	list-style: none;
}

html > body > main > section.mortgage-calculator > div.banks-slider > ul.buttons > li
{
	position: absolute;
	top: 0;
	bottom: 0;

	width: 64px;

	cursor: pointer;
}

html > body > main > section.mortgage-calculator > div.banks-slider > ul.buttons > li.prev
	{
		left: 0;

		-webkit-transform: translateX( -100% );

		        transform: translateX( -100% );
	}

html > body > main > section.mortgage-calculator > div.banks-slider > ul.buttons > li.prev::before
		{
			right: 8px;
			
			-webkit-transform: rotate( -135deg );
			
			        transform: rotate( -135deg );
		}

html > body > main > section.mortgage-calculator > div.banks-slider > ul.buttons > li.next
	{
		right: 0;

		-webkit-transform: translateX( 100% );

		        transform: translateX( 100% );
	}

html > body > main > section.mortgage-calculator > div.banks-slider > ul.buttons > li.next::before
		{
			left: 8px;
			
			-webkit-transform: rotate( 45deg );
			
			        transform: rotate( 45deg );
		}

html > body > main > section.mortgage-calculator > div.banks-slider > ul.buttons > li.disabled
	{
		pointer-events: none;

		opacity: 0.2;
	}

html > body > main > section.mortgage-calculator > div.banks-slider > ul.buttons > li::before
	{
		position: absolute;
		top: 0;
		bottom: 0;

		width: 12px;
		height: 12px;
		margin: auto 0;

		content: '';

		border-top: 2px solid #1b8b80;
		border-right: 2px solid #1b8b80;
	}

html > body > main > section.mortgage-calculator > div.sidebar > details > h2, html > body > main > section.mortgage-calculator > div.sidebar > details > form
	{
		display: none;
	}

html > body > main > section.mortgage-calculator > div.sidebar > details > summary
{

	width: 100%;
	padding: 0;

	list-style: none;
}

html > body > main > section.mortgage-calculator > div.sidebar > details > summary::before
	{
		position: absolute;
		top: 2px;
		right: -16px;
		
		width: 8px;
		height: 8px;

		border-top: 2px solid #84e9d6;
		border-right: 2px solid #84e9d6;

		-webkit-transform: rotate( 45deg );

		        transform: rotate( 45deg );
	}

html > body > main > section.mortgage-calculator > div.sidebar > form
{
	margin-bottom: 40px;
}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.cost
{
	margin-bottom: 40px;
	
	font-weight: 700;
}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.cost > strong
	{
		display: block;

		margin-top: 15px;
		
		font-weight: 400;
	}

html > body > main > section.mortgage-calculator > form > div.range-one
{
	position: relative;
	
	width: 100%;
}

html > body > main > section.mortgage-calculator > form > div.range-one.readonly > div.controls
		{
			display: none;
		}

html > body > main > section.mortgage-calculator > form > div.range-one.promo > div.input > span.input::before
		{
			content: none;
		}

html > body > main > section.mortgage-calculator > form > div.range-one > label
{
	display: block;
	
	margin-bottom: 8px;
	
	font-size: 14px;
	line-height: 1.21;

	color: rgba(7, 43, 49, 0.7);
}

html > body > main > section.mortgage-calculator > form > div.range-one > label[data-sum]
	{
		position: relative;

		cursor: pointer;
	}

html > body > main > section.mortgage-calculator > form > div.range-one > label[data-sum]:hover::after
			{
				opacity: 1;
				
				-webkit-transform: translateY( -100% );
				
				        transform: translateY( -100% );
			}

html > body > main > section.mortgage-calculator > form > div.range-one > label[data-sum]::after
		{
			position: absolute;
			top: -8px;
			left: 0;

			display: block;

			padding: 4px 8px;

			font-size: 14px;
			font-weight: 400;
			
			content: 'Сумма кредита: ' attr( data-sum );

			color: rgba(7, 43, 49, 0.8);
			opacity: 0;
			background: #f5f5f5;

			border: 1px solid #e6e6e6;
			border-radius: 4px;

			-webkit-transform: translateY( calc(-100% - 12px) );

			        transform: translateY( calc(-100% - 12px) );

			transition:
				opacity 0.2s,
				-webkit-transform 0.2s;

			transition:
				opacity 0.2s,
				transform 0.2s;

			transition:
				opacity 0.2s,
				transform 0.2s,
				-webkit-transform 0.2s;
		}

html > body > main > section.mortgage-calculator > form > div.select
{
	position: relative;

	width: 100%;
}

html > body > main > section.mortgage-calculator > form > div.select:nth-child( 2 )
	{
		margin-right: 100px;
	}

html > body > main > section.mortgage-calculator > form > div.select.program-types > label.select
		{
			padding-right: 80px;
		}

html > body > main > section.mortgage-calculator > form > div.select > button.promo-programs
	{
		position: absolute;
		right: 60px;
		bottom: 12px;
		
		width: 21px;
		height: 21px;
		padding: 0;

		cursor: pointer;

		background: url( 'images/star-empty.svg' ) center center no-repeat;

		border: none;
	}

html > body > main > section.mortgage-calculator > form > div.select input
	{
		display: none;
	}

html > body > main > section.mortgage-calculator > form > div.select > input:checked + label::before
		{
			content: '';
		}

html > body > main > section.mortgage-calculator > form > div.select > input:checked ~ ul
		{
			pointer-events: auto;

			opacity: 1;

			-webkit-transform: translateY( 100% );

			        transform: translateY( 100% );
		}

html > body > main > section.mortgage-calculator > ul.banks > li
{
	box-sizing: border-box;
	width: calc(50% - 10px);
	padding: 24px;

	cursor: pointer;

	border: 1px solid #e6e6e6;
	border-radius: 4px;

	transition: border-color 0.2s;
}

html > body > main > section.mortgage-calculator > ul.banks > li:hover
	{
		border-color: rgba(7, 43, 49, 0.8);
	}

html > body > main > section.mortgage-calculator > ul.banks > li:not(:nth-child( -n + 2 ))
	{
		margin-top: 20px;
	}

html > body > main > section.mortgage-calculator > ul.banks > li.selected
	{
		pointer-events: none;
		
		border-color: #84e9d6;
	}

html > body > main > section.mortgage-calculator > ul.banks > li.selected > ul > li.price > ul > li.payment
		{
			color: #84e9d6;
		}

html > body > main > section.mortgage-calculator > ul.banks > li.empty
	{
		display: none;

		width: 100%;

		pointer-events: none;
	}

html > body > main > section.mortgage-calculator > ul.banks > li > h3
{
	margin: 0 0 8px;
}

html > body > main > section.mortgage-calculator > ul.banks > li > p
{
	margin: 0;
}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody
{

}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li:not(:nth-child( -n + 4 )):not(.last)
	{
		display: none;
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li.last > label::before
		{
			content: none;
		}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > input
{
	display: none;
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > input:checked + label
		{
			background: #1b8b80;

			border-color: #1b8b80;
		}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > input:checked + label::before
			{
				background: #84e9d6;

				border-color: #84e9d6;
			}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > input:checked + label::after
			{
				opacity: 1;
			}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > input:checked + label > ul > li, html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > input:checked + label > ul > li:last-child, html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > input:checked + label > ul > li > h4
				{
					color: white;
				}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > ul
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;

	padding: 8px 60px 8px 16px;
	margin: 0;

	font-size: 14px;
	line-height: 1.21;

	list-style: none;

	color: rgba(7, 43, 49, 0.7);
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > ul > li
	{
		box-sizing: border-box;
		width: 100%;
		padding-right: 12px;
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > ul > li:first-child
		{
			-webkit-flex-shrink: 0;
			    -ms-flex-negative: 0;
			        flex-shrink: 0;
			width: 200px;
			margin-right: 24px;
		}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;

	padding: 0;
	margin: 0;

	list-style: none;

	-webkit-user-select: none;

	   -moz-user-select: none;

	    -ms-user-select: none;

	        user-select: none;

	transition: -webkit-transform 0.2s;

	transition: transform 0.2s;

	transition: transform 0.2s, -webkit-transform 0.2s;
}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one
{
	position: relative;
	
	-webkit-flex-grow: 1;
	
	    -ms-flex-positive: 1;
	
	        flex-grow: 1;
	padding-bottom: 9px;
}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one:not(:last-child)
	{
		margin-bottom: 24px;
	}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > label
{
	display: block;
	
	margin-bottom: 15px;
	
	font-weight: 700;
}

html > body > main > section.mortgage-calculator > form > div.range-one > div.controls
{
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;

	height: 2px;
}

html > body > main > section.mortgage-calculator > form > div.range-one > div.controls > button.handle
{
	position: absolute;
	top: -7px;

	width: 16px;
	height: 16px;
	padding: 0;

	cursor: -webkit-grab;

	cursor: grab;

	background: #1b8b80;

	border: none;
	border-radius: 50%;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);

	-webkit-transform: translateX( -50% );

	        transform: translateX( -50% );
}

html > body > main > section.mortgage-calculator > form > div.range-one > div.controls > span.range
{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;

	background: #1b8b80;
}

html > body > main > section.mortgage-calculator > form > div.range-one > div.input
{

}

html > body > main > section.mortgage-calculator > form > div.range-one > div.input > span.percent
{

}

html > body > main > section.mortgage-calculator > form > div.select > label
{
	display: block;
}

html > body > main > section.mortgage-calculator > form > div.select > label:not(.select)
	{
		margin-bottom: 8px;
		
		font-size: 14px;
		line-height: 1.21;

		color: rgba(7, 43, 49, 0.7);
	}

html > body > main > section.mortgage-calculator > form > div.select > label.select
	{
		position: relative;
		
		box-sizing: border-box;
		width: 100%;
		padding: 12px 60px 12px 16px;

		cursor: pointer;

		border: 1px solid #e6e6e6;
		border-radius: 4px;
	}

html > body > main > section.mortgage-calculator > form > div.select > label.select::before
		{
			position: fixed;
			top: 0;
			right: 0;
			z-index: 1;

			width: 100vw;
			height: 100vh;
		}

html > body > main > section.mortgage-calculator > form > div.select > label > span
{
	pointer-events: none;
}

html > body > main > section.mortgage-calculator > form > div.select > label > span[data-empty]
	{
		display: block;
		overflow: hidden;

		width: 100%;

		white-space: nowrap;
		text-overflow: ellipsis;
	}

html > body > main > section.mortgage-calculator > form > div.select > label > span[data-empty]:empty::before
			{
				content: attr( data-empty );
			}

html > body > main > section.mortgage-calculator > form > div.select > label > span.arrow
	{
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;

		width: 42px;

		border-left: 1px solid #e6e6e6;
	}

html > body > main > section.mortgage-calculator > form > div.select > label > span.arrow::before
		{
			position: absolute;
			top: 15px;
			right: 15px;

			width: 7px;
			height: 7px;

			content: '';

			border-top: 2px solid #e6e6e6;
			border-right: 2px solid #e6e6e6;

			-webkit-transform: rotate( 135deg );

			        transform: rotate( 135deg );
		}

html > body > main > section.mortgage-calculator > form > div.select > ul
{
	position: absolute;
	bottom: -8px;
	z-index: 2;
	
	box-sizing: border-box;
	width: 100%;
	padding: 0 0 6px;
	margin: 0;

	pointer-events: none;

	list-style: none;

	opacity: 0;
	background: white;

	border: 1px solid #e6e6e6;
	border-radius: 4px;

	-webkit-transform: translateY( calc(100% + 20px) );

	        transform: translateY( calc(100% + 20px) );

	transition:
		opacity 0.2s,
		-webkit-transform 0.2s;

	transition:
		opacity 0.2s,
		transform 0.2s;

	transition:
		opacity 0.2s,
		transform 0.2s,
		-webkit-transform 0.2s;
}

html > body > main > section.mortgage-calculator > ul.banks > li > ul
{
	padding: 0;
	margin: 0;

	font-size: 14px;
	font-weight: 700;
	line-height: 1.29;
	text-align: right;

	list-style: none;

	pointer-events: none;
}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	gap: 24px;
}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr:first-child
	{
		display: none;
	}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > th, html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td
	{
		padding: 0;
	}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td
{
	font-weight: 700;

	color: #072b31;
}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td:first-child
	{
		max-width: 400px;
		margin-right: auto;

		font-size: 20px;
		line-height: 1.2;
	}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td.mobile
	{
		display: none;
	}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td[data-label]::before
	{
		display: block;

		margin-bottom: 4px;

		font-size: 14px;
		line-height: 1.21;
		font-weight: 400;
		white-space: nowrap;

		content: attr( data-label );

		color: rgba(7, 43, 49, 0.7);
	}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td > strong
	{
		font-size: 28px;
		line-height: 1.21;
	}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > th
{
	padding-bottom: 4px;
	
	font-size: 14px;
	line-height: 1.21;
	font-weight: 400;
	-moz-text-align-last: left;
	     text-align-last: left;
	
	color: rgba(7, 43, 49, 0.7);
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label
{
	position: relative;
	
	display: block;

	cursor: pointer;

	background: white;

	border-radius: 4px;

	transition:
		color 0.2s,
		background 0.2s,
		border-color 0.2s;
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label::before, html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label::after
	{
		position: absolute;

		content: '';
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label::before
	{
		top: 50%;
		right: 19px;
		
		width: 16px;
		height: 16px;

		border: 1px solid #e6e6e6;
		border-radius: 50%;

		-webkit-transform: translateY( -50% );

		        transform: translateY( -50% );

		transition:
			background 0.2s,
			border-color 0.2s;
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label::after
	{
		top: 50%;
		right: 23px;
		
		width: 8px;
		height: 4px;

		opacity: 0;
		
		border: none;
		border-top: 2px solid #1b8b80;
		border-right: 2px solid #1b8b80;
		border-radius: 0;

		-webkit-transform: translateY( calc(-50% - 1px) ) rotate( 135deg );

		        transform: translateY( calc(-50% - 1px) ) rotate( 135deg );

		transition: opacity 0.2s;
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > p
{
	padding: 16px 60px 16px 16px;
	margin: 0;
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > p::after
	{
		position: absolute;
		top: 20px;
		right: 24px;
		
		box-sizing: border-box;
		width: 8px;
		height: 8px;

		content: '';

		border-top: 2px solid #072b31;
		border-right: 2px solid #072b31;

		-webkit-transform: rotate( 135deg );

		        transform: rotate( 135deg );
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-align-items: center;
	    -ms-flex-align: center;
	        align-items: center;

	padding: 16px 60px 16px 16px;
	margin: 0;

	list-style: none;

	color: rgba(7, 43, 49, 0.7);
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li
	{
		width: 100%;
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li:first-child
		{
			-webkit-flex-shrink: 0;
			    -ms-flex-negative: 0;
			        flex-shrink: 0;
			width: 200px;
			margin-right: 24px;
		}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li:last-child, html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li > h4
		{
			font-weight: 700;

			color: #072b31;
		}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li > h4
		{
			margin: 0;
		}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li
{
	-webkit-flex-shrink: 0;
	    -ms-flex-negative: 0;
	        flex-shrink: 0;
	width: calc(11.11% - 7px);
}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li:not(:last-child)
	{
		margin-right: 8px;
	}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.controls
{
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;

	height: 2px;

	background: #e6e6e6;
}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.controls > button.handle
{
	position: absolute;
	top: -8px;

	width: 16px;
	height: 16px;
	padding: 0;

	cursor: -webkit-grab;

	cursor: grab;

	background: #84e9d6;

	border: none;
	border-radius: 50%;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);

	-webkit-transform: translateX( -50% );

	        transform: translateX( -50% );
}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.controls > span.range
{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;

	background: #84e9d6;
}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.input
{

}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.input > span.percent
{

}

html > body > main > section.mortgage-calculator > form > div.range-one > div.input > span.input
{
	position: relative;
	
	display: block;

	width: 100%;
}

html > body > main > section.mortgage-calculator > form > div.range-one > div.input > span.input > input, html > body > main > section.mortgage-calculator > form > div.range-one > div.input > span.input > span.focus-out
	{
		width: 100%;
	}

html > body > main > section.mortgage-calculator > form > div.range-one > div.input > span.input::before
	{
		position: absolute;
		top: 13px;
		right: 18px;

		content: attr( data-percent );

		opacity: 0.4;
	}

html > body > main > section.mortgage-calculator > form > div.range-one > div.input > span.input > input
{
	box-sizing: border-box;
	padding: 9px 16px;

	font: inherit;

	color: #072b31;

	border: 1px solid #e6e6e6;
	border-radius: 4px;
}

html > body > main > section.mortgage-calculator > form > div.range-one > div.input > span.input > input:focus
	{
		outline: none;
	}

html > body > main > section.mortgage-calculator > form > div.range-one > div.input > span.input > span.focus-out
{
	position: absolute;
	top: 0;
	left: 0;
}

html > body > main > section.mortgage-calculator > form > div.select > ul > li:first-child > label, html > body > main > section.mortgage-calculator > form > div.select > ul > li:nth-child( 2 ) > label
		{
			padding-top: 12px;
		}

html > body > main > section.mortgage-calculator > form > div.select > ul > li > input:checked + label[for='mortgage_type_developer_special']
		{
			background-position-x: calc(100% - 36px);
		}

html > body > main > section.mortgage-calculator > form > div.select > ul > li > input:checked + label::before
		{
			content: '';
		}

html > body > main > section.mortgage-calculator > form > div.select > ul > li > label
{
	position: relative;
	
	display: block;
	
	padding: 6px 16px;

	cursor: pointer;
}

html > body > main > section.mortgage-calculator > form > div.select > ul > li > label:hover
	{
		background: #f5f5f5;
	}

html > body > main > section.mortgage-calculator > form > div.select > ul > li > label.all
	{
		padding-top: 14px;
		padding-bottom: 12px;

		border-bottom: 1px solid #e6e6e6;
	}

html > body > main > section.mortgage-calculator > form > div.select > ul > li > label.selected[for='mortgage_type_developer_special']
		{
			background-position-x: calc(100% - 40px);
		}

html > body > main > section.mortgage-calculator > form > div.select > ul > li > label.selected::before
		{
			content: '';
		}

html > body > main > section.mortgage-calculator > form > div.select > ul > li > label[for='mortgage_type_developer_special']
	{
		background-image: url( 'images/star-full.svg' );
		background-position: calc(100% - 20px) center; 
		background-repeat: no-repeat;
	}

html > body > main > section.mortgage-calculator > form > div.select > ul > li > label::before
	{
		position: absolute;
		top: 10px;
		right: 12px;

		width: 12px;
		height: 6px;

		border-top: 2px solid #84e9d6;
		border-right: 2px solid #84e9d6;

		-webkit-transform: rotate( 135deg );

		        transform: rotate( 135deg );
	}

html > body > main > section.mortgage-calculator > ul.banks > li > ul > li:first-child
	{
		margin-bottom: 8px;
	}

html > body > main > section.mortgage-calculator > ul.banks > li > ul > li.price
	{
		margin-top: 32px;

		font-size: 20px;
		font-weight: 400;
		line-height: 1.2;
	}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li > label
{
	display: block;

	box-sizing: border-box;
	-webkit-flex-shrink: 0;
	    -ms-flex-negative: 0;
	        flex-shrink: 0;
	height: 100%;
	padding: 12px;

	cursor: pointer;

	border-radius: 4px;
}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li > label.selected
	{
		background: #f5f5f5;
	}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.input > span.input
{
	position: relative;
	
	display: block;

	width: 100%;
}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.input > span.input > input, html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.input > span.input > span.focus-out
	{
		width: 100%;
	}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.input > span.input > input
{
	padding: 0;

	border: none;
}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.input > span.input > input:focus
	{
		outline: none;
	}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > div.input > span.input > span.focus-out
{
	position: absolute;
	top: 0;
	left: 0;
}

html > body > main > section.mortgage-calculator > ul.banks > li > ul > li > ul
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	        flex-wrap: wrap;
	-webkit-justify-content: space-between;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-align-items: baseline;
	    -ms-flex-align: baseline;
	        align-items: baseline;
	
	padding: 0;
	margin: 0;

	list-style: none;
}

html > body > main > section.mortgage-calculator > ul.banks > li > ul > li > ul > li.payment
	{
		font-size: 24px;
		font-weight: 700;
		line-height: 1.42;
	}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li > label > figure
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
	
	height: 100%;
	margin: 0;
}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li > label > figure > img
{
	width: 48px;
	height: 48px;
	margin-bottom: 12px;

	object-fit: contain;
}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li > label > figure > figcaption
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-justify-content: space-between;
	    -ms-flex-pack: justify;
	        justify-content: space-between;

	-webkit-flex-grow: 1;

	    -ms-flex-positive: 1;

	        flex-grow: 1;
	
	font-size: 14px;
	line-height: 1.21;
	-webkit-hyphens: manual;
	   -moz-hyphens: manual;
	    -ms-hyphens: manual;
	        hyphens: manual;
}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li > label > figure > figcaption > strong
{
	margin-top: 8px;
	
	font-size: 17px;
	line-height: 1.18;
	font-weight: 700;

	color: rgba(27, 139, 128, 0.3);
}

@media (min-width: 700px) and (max-width: 1099px)
	{
	}

@media (min-width: 1100px) and (max-width: 1399px)
	{
	}

@media (max-width: 1599px)
				{

html > body > main > section.environment > div.slideshow > div.sections > section > p
			{
					font-size: 14px
			}

html > body > main > section.environment > div.slideshow > div.controls
		{
				bottom: 40px
		}

html > body > main > section.cigarette > h2
{
		width: calc(25vw - 18px)
}

html > body > header > div.info > ul > li:first-child > a > span > span
				{
						display: none
				}

html > body > main > section.mortgage-calculator > ul.banks > li
{
		padding: 16px
}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li
{
		width: calc(14.29% - 7px)
}
				}

@media (max-width: 1399px)
	{html > body > main > section.cigarette > a, html > body > main > section.mortgage-calculator > div.bank-card > details > summary, html > body > main > section.mortgage-calculator > div.sidebar > details > summary
{
		padding: 0 27px
}
html > body > header > div.info > h1, html > body > main > section.banks > h2
{
		font-size: 36px
}

html > body > header > div.info
{
		width: 60%
}

html > body > header > div.info > h1, html > body > header > div.info > p
	{
			width: 100%
	}

html > body > header > figure
{
		width: 40%
}

html > body > main > section.banks > aside
{
		font-size: 13px;
		line-height: 1.2
}

html > body > main > section.cigarette > picture
{
		margin-right: -200px
}

html > body > main > section.mortgage-calculator > div.bank-card
{
		gap: 16px;
		
		padding: 20px
}

html > body > main > section.mortgage-calculator > div.sidebar
{
		width: 30%
}

html > body > main > section.mortgage-calculator > ul.banks
{
		padding-left: calc(30% + 3.13vw - 2px)
}

html > body > main > section.mortgage-calculator > form > div.select:nth-child( 2 )
	{
			margin-right: 0
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > ul > li
	{
			width: 20%
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > ul > li:first-child
		{
				width: 20%
		}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li
	{
			width: 20%
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li:first-child
		{
				width: 20%
		}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li
{
		width: calc(20% - 6px)
}

html > body > main > section.mortgage-calculator > ul.banks > li > ul > li.price
	{
			font-size: 17px
	}

html > body > main > section.mortgage-calculator > ul.banks > li > ul > li > ul > li.payment
	{
			font-size: 20px
	}
	}

@media (max-width: 1099px)
	{

html > body > header
{
		-webkit-flex-direction: column;
		    -ms-flex-direction: column;
		        flex-direction: column;
		
		margin-left: 0
}

html > body > main
{
		margin-left: 0
}

html > body > main > section.environment
{
		padding-top: 70px
}

html > body > main > section.environment > div.slideshow > div.sections > section
		{
				padding-top: 24px
		}

html > body > header > div.info
{
		width: 100%;
		padding: 40px 5vw
}

html > body > header > div.info > p
{
		font-size: 17px;
		line-height: 1.47
}

html > body > header > figure
{
		-webkit-order: -1;
		    -ms-flex-order: -1;
		        order: -1;
		
		width: 100%;
		height: 60vw;
		max-height: 300px
}

html > body > main > section.cigarette
{
		margin-top: 70px
}

html > body > main > section.cigarette > h2, html > body > main > section.cigarette > a
	{
			margin-right: 5vw;
			margin-left: 5vw
	}

html > body > main > section.cigarette > h2
{
		width: auto;
		padding-top: 0
}

html > body > main > section.banks
{
		padding-top: 70px
}

html > body > main > section.mortgage-calculator
{
		padding-top: 70px;
		margin: 0 5vw
}

html > body > main > section.mortgage-calculator > div.empty
{
		margin-left: 0
}

html > body > header > div.info > ul
{
		max-width: none
}

html > body > main > section.cigarette > picture
{
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: flex-end;
		    -ms-flex-pack: end;
		        justify-content: flex-end;
		float: none;
		
		margin: 0 0 16px auto
}

html > body > main > section.cigarette > picture > img
{
		width: 100%;
		max-width: none;
		height: auto;
		max-height: none
}

html > body > main > section.mortgage-calculator > div.bank-card
{
		margin-left: 0
}

html > body > main > section.mortgage-calculator > form
{
		position: static;
		
		float: none;

		width: 100%
}

html > body > header > div.info > ul > li:first-child > a > span > span
				{
						display: block
				}
	}

@media (max-width: 699px)
	{

html > body > main > section.banks
{
		gap: 24px
}

html > body > main > section.banks > aside
{
		-webkit-order: 1;
		    -ms-flex-order: 1;
		        order: 1;
		gap: 12px
}

html > body > main > section.banks > aside::before
	{
			width: 32px;
			height: 32px;

			background-size: 16px
	}

html > body > main > section.banks > h2
{
		width: 100%;
		margin-bottom: 0
}

html > body > header > div.info > ul
{
		grid-template-columns: 1fr;
		grid-template-rows: 1.5fr 1fr 1fr
}

html > body > main > section.mortgage-calculator > div.bank-card
{
		gap: 12px;
		
		box-sizing: border-box;
		width: calc(100% + 10vw);
		padding: 12px 5vw;
		margin-left: -5vw
}

html > body > main > section.mortgage-calculator > div.sidebar
{
		position: static;

		width: 100%;
		margin-bottom: 20px
}

html > body > main > section.mortgage-calculator > form > div.cost
{
		margin-bottom: 16px
}

html > body > main > section.mortgage-calculator > ul.banks
{
		padding-left: 0
}

html > body > main > section.mortgage-calculator > div.bank-card > details
{
		-webkit-order: 0;
		    -ms-flex-order: 0;
		        order: 0
}

html > body > main > section.mortgage-calculator > div.bank-card > p.cost
{
		width: 100%;

		text-align: left
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs
{
		-webkit-flex-direction: row;
		    -ms-flex-direction: row;
		        flex-direction: row;
		gap: 12px;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;

		-webkit-flex-shrink: 0;

		    -ms-flex-negative: 0;

		        flex-shrink: 0;
		width: calc(100% + 10vw);
		padding: 0 5vw;
		margin-left: -5vw
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs::after
	{
			content: ''
	}

html > body > main > section.mortgage-calculator > div.banks-slider > ul.buttons > li.prev::before
		{
				right: -2px
		}

html > body > main > section.mortgage-calculator > div.banks-slider > ul.buttons > li.next::before
		{
				left: -2px
		}

html > body > main > section.mortgage-calculator > div.sidebar > details > summary
{
		position: relative;

		width: -webkit-max-content;

		width: -moz-max-content;

		width: max-content;
		height: auto;
		
		font-weight: 700;
		line-height: 1;
		
		cursor: pointer;
		-webkit-appearance: none;
		   -moz-appearance: none;
		        appearance: none;

		list-style: none;

		background: none;

		border: none;
		box-shadow: none
}

		html > body > main > section.mortgage-calculator > div.sidebar > details > summary:hover:not([disabled])
		{
			color: #072b31;
			background: none;
		}

html > body > main > section.mortgage-calculator > div.sidebar > details > summary::before
	{
			content: ''
	}

html > body > main > section.mortgage-calculator > div.sidebar > form
{
		margin-bottom: 32px
}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.cost
{
		margin-bottom: 16px
}

html > body > main > section.mortgage-calculator > form > div.range-one > label
{
		margin-bottom: 8px
}

html > body > main > section.mortgage-calculator > form > div.range-one > label[data-sum]:hover::after
			{
					-webkit-transform: none;
					        transform: none
			}

html > body > main > section.mortgage-calculator > form > div.range-one > label[data-sum]::after
		{
				position: static;

				padding: 0;
				margin-top: 2px;

				opacity: 0.8;
				background: none;

				border: none;

				-webkit-transform: none;

				        transform: none
		}

html > body > main > section.mortgage-calculator > ul.banks > li
{
		width: 100%
}

html > body > main > section.mortgage-calculator > ul.banks > li:nth-child( 2 )
	{
			margin-top: 20px
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li
{
		max-width: calc(100% - 24vw)
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li:not(:nth-child( -n + 4 )):not(.last)
	{
			display: block
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li.headings
	{
			display: none
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li.last
	{
			display: none
	}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one:not(:last-child)
	{
			margin-bottom: 24px
	}

html > body > main > section.mortgage-calculator > div.sidebar > form > div.range-one > label
{
		margin-bottom: 8px
}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr
{
		-webkit-flex-wrap: wrap;
		    -ms-flex-wrap: wrap;
		        flex-wrap: wrap;
		gap: 8px 16px
}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td:not(.payment)
	{
			font-size: 16px
	}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td.payment, html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td.title
	{
			-webkit-order: -1;
			    -ms-flex-order: -1;
			        order: -1;

			width: 100%
	}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td.base
	{
			width: 100%
	}

html > body > main > section.mortgage-calculator > div.bank-card > table.selected-program > tbody > tr > td.mobile
	{
			display: block
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label::before
	{
			top: 12px;
			right: 12px;

			-webkit-transform: none;

			        transform: none
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label::after
	{
			top: 17px;
			right: 16px;

			-webkit-transform: rotate( 135deg );

			        transform: rotate( 135deg )
	}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul
{
		-webkit-flex-wrap: wrap;
		    -ms-flex-wrap: wrap;
		        flex-wrap: wrap;
		gap: 8px 12px;
		
		padding: 12px 48px 12px 12px
}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li:not(:first-child):not(:last-child)
		{
				overflow: hidden;
				
				width: auto;
				max-width: calc(33.33% - 8px);

				font-size: 14px;
				line-height: 1.21;
				white-space: nowrap;
				text-overflow: ellipsis
		}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li:first-child
		{
				width: 100%
		}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li:last-child
		{
				width: 100%
		}

html > body > main > section.mortgage-calculator > div.bank-card > ul.programs > li > label > ul > li > h4
		{
				overflow: hidden;

				white-space: nowrap;
				text-overflow: ellipsis
		}

html > body > main > section.mortgage-calculator > div.banks-slider > div.container > ul.slides > li
{
		width: calc(33.33% - 5px)
}

html > body > main > section.mortgage-calculator > ul.banks > li > ul > li.price
	{
			margin-top: 12px
	}
	}