/* 
 Theme Name:     Vaurioauto
 Author:         WTF Marketing Collective Oy
 Author URI:     https://welltoldfacts.fi
 Version:        99.0 
*/

select:focus,
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {   
	border-color: #121212;
	box-shadow: 0px 23px 14px -14px rgba(0,0,0,0.05);
  	outline: 0 none;
	border:solid 1px #ddd;
}

body.home .header-pyyda-tarjous,
body.home .pyyda-tarjous-menu-link {
	display:none;
}

/* COOKIEBOT */

#CybotCookiebotDialog {
	font-family:'roc-grotesk', sans-serif !important;
}

#CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonCustomize .CybotCookiebotDialogArrow,
#CybotCookiebotDialogPoweredByText,
#CybotCookiebotDialogHeader {
	display:none !important;
}

#CybotCookiebotDialog button {
	font-family:'roc-grotesk-wide', sans-serif !important;
	font-weight:normal !important;
}

.cc-window {
	font-family: roc-grotesk, sans-serif;
  	font-size: 15px;
  	line-height: 1.4;
}

.cc-window .cc-link {
	padding-top:0;
	padding-right:0;
}

.cc-window .cc-btn {
	border-radius: 28px;
	padding: 10px 25px 8px 25px;
	font-weight: 500;
	line-height: 1.6;
	font-size: 12px;
	background: #fe6525 !important;
	color: #fff !important;
	display: inline-block;
	border: solid 2px #fe6525 !important;
	transition: all .1s ease-out;
	font-family: roc-grotesk-wide, sans-serif;
	letter-spacing:0;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}

.cc-window .cc-btn:hover {
	opacity:1;
	background-color:#121212 !important;
	color:#fe6525 !important;
	border:solid 2px #fe6525 !important;
}

.cc-floating.cc-theme-classic {
	padding: 1.5em !important;
	border-radius:6px;
	max-width:34em;
}

.cc-floating.cc-type-info.cc-theme-classic .cc-compliance {
	text-align: left !important;
}

@media screen and (max-width: 414px) and (orientation: portrait), screen and (max-width: 736px) and (orientation: landscape) {
	.cc-window {
	  border-radius:0 !important;
	}
}

body {
	background:#f6f8ef;
	font-family: roc-grotesk, sans-serif;
	font-weight:400;
	color:#121212;
	font-size:16px;
	line-height:1.6;
}

.edit-link {
	margin-right:20px;
	margin-bottom:20px;
	color:#121212;
	display:inline-block;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}

.edit-link-container {
	display:block;
	text-align:right;
	margin-bottom:20px;
}

.buyer-profile-details .row {
	border-bottom:solid 1px #eee;
	padding:17px 5px 15px 5px;
	font-size:15px;
	line-height:1;
	background: rgba(255,255,255,0.6);
}

.buyer-profile-details .row > div:first-child {
	font-weight:600;
}

.buyer-profile-details .last-row {
	border-bottom:none;
}

.edit-link:hover {
	color:#fe6525;
}

.edit-link i {
	padding-right:4px;
}

html {
	margin:0 0 0 0 !important;
}

.ostaja-row {
	max-width:1400px !important;
}

b,strong {
	font-weight:600;
}

h1,h2 {
	font-family: roc-grotesk-wide, sans-serif;
	font-weight:700;
	color:#fe6525;
	line-height:1 !important;
	font-size:44px;
}

h3,h4 {
	font-family: roc-grotesk-wide, sans-serif;
	font-weight:700;
}

a:hover {
	color:inherit;
	text-decoration:none;
}

/* BUTTONS */

button:focus,
button:active {
	outline:none;
}

button:disabled,
button[disabled] {
	opacity:0.5;
}

button:disabled:hover,
button[disabled]:hover {
	cursor:not-allowed;
}

button {
	letter-spacing:0;
}

button,
.button {
	border-radius: 28px;
	padding: 12px 32px 10px 32px;
	font-weight: 500;
	line-height: 1.6;
	font-size: 15px;
	background: #fe6525;
	color: #fff;
	display: inline-block;
	border: solid 1px transparent;
	transition: all .1s ease-out;
	font-family: roc-grotesk-wide, sans-serif;
	letter-spacing:0;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}

.yes-thank-you {
	font-size:19px;
	padding: 22px 32px 18px 32px;
	width:300px;
	border-radius: 50px;
	max-width:100%;
}

.button.black-bg {
	background:#121212;
}

.button.black-bg:hover {
	background:#fe6525;
}

#main-header .button {
	margin-right:70px;
}

.prev-button {
	background:transparent;
	border:solid 1px #121212;
	color:#121212;
	margin-right:10px;
	margin-bottom:10px;
}

.no-thanks {
	background:transparent;
	border:solid 1px #121212;
	color:#121212;
	margin-left:10px;
	margin-bottom:10px;
}

button:hover,
.button:hover {
	background:#121212;
	color:#FFF;
}

.fullwidth-btn {
	width:100%;
}

#finishprogress {
	font-size:20px;
}

header {
	padding-top:20px;
	padding-bottom:20px;
}

/*header#main-header.scrolling {
	padding-top:10px;
	padding-bottom:10px;
}*/

header .button {
	background:#121212;
}

header .button:hover {
	background:#fe6525;
}

.logo {
	width:240px;
	padding-left:0px;
}

.symbol-nega,
.symbol {
	width:90px;
	margin-left:-30px;
}

.symbol-nega {
	display:none;
}

.scrolling .symbol-nega {
	display:inline-block;
}

.scrolling .symbol {
	display:none;
}

.header-button-col {
	padding-right:0;
}

.header-logo-col {
	padding-left:0;
}

#mainhero .container {
	background:#F6F8EF;
	border-radius:18px 18px 0 0;
	padding-top:20px;
	padding-bottom:20px;
	min-height:calc(100vh - 141px);
	display:flex;
	align-items: center;
}

#mainhero p {
	font-size:17px;
}

.fin-register {
	position:absolute;
	width:45px;
	top:0;
	left:0;
	border-radius:6px 0 0 6px;
	line-height:66px;
	color:#FFF;
	font-weight:700;
	text-align:center;
	display:block;
	z-index:1;
	background:#4261f9;
}

#app .container {
	display:block;
	padding-bottom:100px;
}

.login-row,
#company-register-app {
	margin-bottom:30px;
}

#company-register-app form p:first-child {
	margin-bottom:20px;
}

.offer-available {
	font-size:12px;
	display:block;
	margin-top:20px;
}

#app {
	margin-bottom:0px;
	min-height:calc(100vh - 91px);
	justify-content:center;
	align-items:center;
	display:flex;
}

#buyer-app,
#vaurioauto-buyer {
	min-height:90vh;
}

#app p {
	max-width:520px;
}

.car-page-row > div {
	padding:0 0 0 0 ;
}

.car-page-row .modal-header {
	padding:1rem;
}

.car-page-row .car-card-otsikko {
	min-height:auto;
	margin-bottom:15px;
}

.car-page-row .make-an-offer {
	border-radius:6px;
	border:none;
}

#mainhero h4 {
	padding-top:40px;
	font-size:18px;
	padding-bottom:5px;
}

#mainhero h1 {
	font-size:48px;
	padding-bottom:10px;
}

.si-hl {
	color: #121212;
	transform: rotate(-8deg);
	display: inline-block;
}

/* FORMS */

textarea {
	padding:20px;
	font-size: 15px;
	font-weight: 400;
	border-radius: 6px;
	margin-bottom: 10px;
	border:solid 1px #ddd;
	width:100%;
	display:block;
	min-height:170px;
	line-height:1.3;
}

.question-row label {
	padding-left:5px;
}

.question-row textarea {
	min-height:190px;
	margin-top:15px;
}

.question-row legend span {
	color:#fe2551;
	position: absolute;
  	margin-left: 3px;
}

h3.questions-title {
	padding-top:80px;
	padding-bottom:20px;
}

.question-row > div {
	padding:50px;
	background:#fcfcfa;
	border:solid 1px #F6F8EF;
}

input[type="radio"] {
	accent-color:#fe6525;
	border:none;
}

input[type='radio'] + label:hover {
	cursor:pointer;
}

/* Hide the default radio button */
input[type='radio'] {
    display: none;
}

/* Style the label to use FontAwesome icons */
input[type='radio'] + label:before {
	font-family: "FontAwesome";
    display: inline-block;
    content: "\f10c";
    color: #fe6525;
	margin-right:5px;
}

.buyer-table th a {
	color:#121212;
	position:relative;
}

.buyer-table th a.active:after {
	font-family: "FontAwesome";
    display: inline-block;
    content: "\f062";
	position:absolute;
	font-size:0.7em;
	right:-13px;
}

.buyer-table th a.desc:after {
	font-family: "FontAwesome";
    display: inline-block;
    content: "\f063";
}

/* Style for checked state */
input[type='radio']:checked + label:before {
    content: "\f058";
    color: #fe6525;
    font-size: 20px;
    left: 12px !important;
    top: 10px;
}


input[type='radio'] + label {
	padding-left:5px;
}

.question-row legend {
	font-weight:600;
	line-height:1.2;
	padding-bottom:3px;
	font-size:19px;
}

.question-row label {
	font-size:14px;
	margin-bottom:0px;
	line-height:1.3;
	display:block;
	border:solid 1px #ddd;
	background:transparent;
	margin:13px 0;
	border-radius:6px;
	padding:15px 10px 14px 40px !important;
	position:relative;
	letter-spacing:0.5px;
}

.question-row input[type='radio']:checked + label {
	background:#FFF;
	border:solid 1px #fe6525;
}

.question-row input[type='radio'] + label:before {
	left:15px;
    position: absolute;
}

select,
input[type="number"],
input[type="password"],
input[type="text"] {
	position: relative;
	z-index: 0;
	padding: 29px 20px 10px 20px;
	font-size: 16px;
	font-weight: 600;
	border-radius: 6px;
	margin-bottom: 10px;
	border:solid 1px #ddd;
	width:100%;
	display:block;
}

.select-container select {
	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

select:after {
	content:"\f078";
	font-family: "FontAwesome";
	position:absolute;
	right:20px;
}

.select-container i {
	position: absolute;
	right: 15px;
	font-size:13px;
	top: 27px;
	pointer-events: none; /* Makes the icon non-interactive */
}

input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #121212;
	opacity: 0; /* Firefox */
}
  
input:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #121212;
	opacity:0;
}
  
input::-ms-input-placeholder { /* Microsoft Edge */
	color: #121212;
	opacity:0;
}

textarea::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #121212;
	opacity: 0.7; /* Firefox */
}
  
textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #121212;
	opacity: 0.7;
}
  
textarea::-ms-input-placeholder { /* Microsoft Edge */
	color: #121212;
	opacity: 0.7;
}

#registernumber {
	text-transform:uppercase;
}

#register-next {
    position: absolute;
    right: 0;
    top: 0;
    bottom: auto;
    background: #fe6525;
    border: solid 0px #121212;
    border-radius: 0 6px 6px 0;
    padding: 21px 26px;
    font-weight: 500;
    color: #FFF;
    font-size: 15px;
    letter-spacing: 0;
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}

#offer-btn {
	position: absolute;
	right: 0;
	top: 0;
	bottom:0;
	background: #fe6525;
	border: solid 0px #121212;
	border-radius: 0 6px 6px 0;
	width:45px;
	padding:0;
	font-weight: 500;
	color: #FFF;
	font-size: 15px;
	letter-spacing:0;
	line-height:1;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}

#offer-btn:hover {
	color:#fff;
	background:#121212;
}

#register-next:hover {
	opacity: 1;
	color:#fff;
	background:#121212;
}

.footer-placeholder {
	width:100%;
}

.input-container {
	position:relative;
	line-height:1.6;
}

.wait-a-moment {
	font-size:25px;
}

#heroform {
	max-width:450px;
	padding-top:0px;
}

#comp-login-form {
	min-height:auto;
}

#heroform input:not(:placeholder-shown):invalid~.floating-label,
#heroform .floating-label {
	left:60px;
}

#heroform input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #121212;
	opacity: 0.5; /* Firefox */
}
  
#heroform input:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #121212;
	opacity:0.5;
}
  
#heroform input::-ms-input-placeholder { /* Microsoft Edge */
	color: #121212;
	opacity:0.5;
}

#heroform input {
	font-size:24px;
	padding: 13.5px 20px 13.5px 60px;
}

#heroform .floating-label {
	font-size:20px;
	top:19px;
	font-weight:700;
}

#heroform input:focus~.floating-label,
#heroform input:not(:focus):valid~.floating-label,
#heroform input:not(:placeholder-shown):valid~.floating-label {
	font-size:11px;
	top:12px;
}

select~.floating-label {
		top: 13px;
		bottom: 10px;
		left: 20px;
		font-size: 11px;
		opacity: 1;
		color: #666;
}
input:read-only~.floating-label,
input:focus~.floating-label,
input:not(:focus):valid~.floating-label {
	top: 15px;
	bottom: 10px;
	left: 20px;
	font-size: 11px;
	opacity: 1;
	color: #666;
}

h3.questions-title i,
a.button i,
h4 i,
.floating-label i {
	padding-right:4px;
}

button i {
	padding-left:4px;
}

input:focus {
	outline: none;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3);
	border: solid 1px #ccc;
}

input:not(:placeholder-shown):valid~.floating-label {
	top: 15px;
	bottom: 10px;
	left: 20px;
	font-size: 11px;
	opacity: 1;
	color: #666;
}

.floating-label {
	position: absolute;
	pointer-events: none;
	left: 20px;
	top: 23px;
	transition: 0.2s ease all;
	font-size: 15px;
	color: #666;
	z-index: 9;
	font-weight: 500;
	letter-spacing:0;
}

input:not(:placeholder-shown):invalid~.floating-label {
	top: 15px;
	bottom: 10px;
	left: 20px;
	font-size: 11px;
	opacity: 1;
	color: #666;
}

.check-terms input {
	margin-right:10px;
}

.check-terms {
	font-size:14px;
	padding-top:10px;
	display:block;
}

.fin {
	background: #1b60ff;
	color: #FFF;
	font-weight: 500;
	letter-spacing: 1px;
	position: absolute;
	z-index: 1;
	bottom: 0;
	top: 0;
	padding: 19px 10px;
	border: solid 0px #fff;
	border-radius: 6px 0 0 6px;
}

/* Existing styles remain unchanged */
input[type="checkbox"] {
    display: none;
}

input[type="checkbox"] + label {
    position: relative;
    padding-left: 25px;
    cursor: pointer;
    display: inline-block;
    font-size:15px;
    letter-spacing:0;
    margin-top:10px;
}

input[type="checkbox"] + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #ffffff;
}

input[type="checkbox"]:checked + label:before {
    background-color: #121212;
    border:1px solid #121212;
}

/* Replaced styles with FontAwesome checkmark */
input[type="checkbox"] + label:after {
    font-family: 'FontAwesome';
    content: '\f00c';  /* Unicode for check (fas fa-check) */
    position: absolute;
    left: 5px;
    top: 2px;
    font-size: 12px;
    color: transparent;  /* Initially, the checkmark is transparent */
}

input[type="checkbox"]:checked + label:after {
    color: #fff;  /* When checked, the checkmark turns to #121212 */
}


/* PROGRESS */

.progress-row div {
	text-align:center;
}

#app .progress-container p {
	max-width:100%;
}

a {
	color:#fe6525;
}

.user-row,
.progress-container .row {
	max-width: 1200px;
	margin: auto;
	position:relative;
}

.progress-container {
	padding-top:40px;
}

.user-row {
	padding-bottom:80px;
}

.user-row p {
	max-width:700px !important;
}

.progress-row {
	padding-top:45px;
}

.progress-container.go-visible {
	padding-top:50px;
	padding-bottom:80px;
}

.progress-container h2 {
	font-size:50px;
	padding-bottom:40px;
	padding-top:50px;
}

.progress-row:before {
	content:'';
	position:absolute;
	left:0;
	right:0;
	height:2px;
	background:#121212;
	top:50%;
}

.progress-active {
	width:100px;
	height:50px;
	margin:auto;
	background:#F6F8EF;
	padding:0 13px;
}

.progress-name {
	padding-top:15px;
}

.progress-number {
	width:50px;
	height:50px;
	border:solid 2px #121212;
	background:#F6F8EF;
	border-radius:50%;
	margin:auto;
	font-size:22px;
	padding-top:6px;
}

.car-info-container {
	max-width: 1200px;
	margin: auto;
	background: transparent;
	border-radius: 6px;
	padding:0px;
}

.car-info-container .row > div {
	padding:30px 40px;
	border:solid 1px #F6F8EF !important;
}

.car-info-container .row > div:nth-child(odd) {
	background:rgba(255,255,255,0.6);
}

.car-info-container .row > div:nth-child(even) {
	background:rgba(255,255,255,0.6);
}

.car-info-container .row > div:last-child {
	border-bottom:solid 2px #F6F8EF;
}

.car-info-container .row:last-child > div {
	border-bottom:none;
}

.car-info-row-headline {
	font-weight:600;
}

.car-info-row-info {
	line-height:1.4;
}

.progress-container h4 {
	font-size:21px !important;
	margin-bottom:1rem;
}

h3.questions-title i,
.progress-container h4 i {
	color:#fe6525;
}

.mainhero-text-container {
	padding-bottom:100px;
	padding-top:40px;
}

/* ASIAKASNÄKYMÄ */

.kohteesi-col {
	padding-top:60px;
}

.auto-card {
	border-radius:9px;
	background:#fcfcfa;
	position:relative;
	padding:40px 40px 40px 340px;
	min-height:320px;
	margin-bottom:30px;
	box-shadow: 0px 23px 14px -14px rgba(0,0,0,0.06);
}

.auto-card.auto-card-open {
	padding:40px 40px 820px 340px;
	min-height:auto;
}

.auto-card-external-car-info {
	font-size:15px;
}

.auto-card.auto-card-closed .auction-on,
.auto-card.auto-card-closed .auto-buyer-external-info,
.auto-card.auto-card-closed .auto-card-make-offer,
.auto-card.auto-card-closed .auto-card-external-car-info {
	display:none;
}

.auto-card.auto-card-closed {
	box-shadow: none;
}

.auto-card.auto-card-closed.not-offered-yet {
	padding-bottom:27px;
}

.auto-card.auto-card-closed {
	padding:30px;
	min-height:auto;
	transition: all 0.2s ease;
}

.auto-card.auto-card-closed .auto-card-image {
	display:none;
}

.auto-card.auto-card-closed .auto-card-register-number {
	padding-bottom:0 !important;
}

.auto-card.auto-card-open {
    transition: all 0.2s ease;
	box-shadow: 0px 23px 14px -14px rgba(0,0,0,0.06);
}

.auto-card.auto-card-closed:hover {
	box-shadow: 0px 23px 14px -14px rgba(0,0,0,0.06);
}

.auto-card.auto-card-open .auction-on,
.auto-card.auto-card-open .auto-buyer-external-info,
.auto-card.auto-card-open .auto-card-make-offer,
.auto-card.auto-card-open .auto-card-external-car-info {
    display: block;
}

.auto-card.auto-card-open .auto-card-image {
    display: block;
}

.auto-card.auto-card-open .auto-card-register-number {
    padding-bottom: 20px !important;
}

.auto-card-offer, .auto-card-register-number {
	font-family: roc-grotesk-wide, sans-serif;
	font-weight: 700;
	color: #121212;
	line-height: 1 !important;
	font-size: 23px;
	width: 80%;
}

.auto-card-offer {
	position:absolute;
	right:auto;
	bottom:20px;
	color:#9cb350;
}

.auto-card-offer.auto-card-offer-given {
	left: 0;
	bottom: 0;
}

.auction-ended {
	color:#fe6525;
}

.auto-card-offer span {
	font-family: roc-grotesk, sans-serif;
	font-size:17px;
	color:#121212;
	font-weight:400;
}

.auto-card-add-images {
	margin-top:20px;
}

.auto-card-add-images .button {
	background:#fff;
	color:#121212;
	border:solid 2px #121212;
	width:210px;
	text-align:center;
	margin-bottom:0px;
	font-size:13px;
	margin-right:10px;
}

.auto-card-add-images .button:hover {
	background:#121212;
	color:#FFF;
}

.auto-card-add-images {
	position: absolute;
	bottom: 25px;
	right: 10px;
  }

#accept-offer {
	background:#fe6525;
	color:#FFF;
	border-color:#fe6525;
}

#accept-offer:hover {
	background:#121212;
	border-color:#121212;
}

.auto-card-image {
	width:300px;
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	background:url(img/auto-placeholder.png);
	background-size:cover;
	border-radius:9px 0 0 9px;
	z-index:9;
}

.auto-card-closed:hover {
	cursor:pointer;
}

.auto-card-image.auto-image2 {
	background:url(img/auto-placeholder2.png);
	background-size:cover;
}

.auction-on {
	position:absolute;
	background:#d7e0b9;
	font-size:12px;
	color:#121212;
	line-height:1.4;
	top:8px;
	right:-7px;
	text-align:center;
	border-radius:3px 0 0 3px;
	padding:7px 10px 5px 10px;
	letter-spacing:0;
	z-index:2;
}

.auction-off {
	position:absolute;
	background:#eee;
	font-size:16px;
	color:#121212;
	line-height:1.4;
	top:15px;
	right:-7px;
	text-align:center;
	border-radius:6px 0 0 6px;
	padding:10px 20px;
	letter-spacing:0;
}

.auction-on b,
.auction-off b {
	font-weight:400;
}

.filters {
	margin-top:60px !important;
	background:#f4f4f4;
	border:dotted 1px #444;
	padding:50px;
	border-radius:9px;
	font-size:14px;
}

.not-offered-yet .auction-off,
.not-offered-yet .auction-on {
	top:30px;
}

.auto-card.not-offered-yet {
	padding-bottom:150px;
}

.auto-buyer-external-info .button {
	background:#FFF;
	border:solid 2px #fe6525;
	color:#fe6525;
}

.auto-buyer-external-info .button:hover {
	background:#121212;
	color:#FFF;
	border-color:#121212;
}

.auction-on:after,
.auction-off:after {
	bottom:-7px;
    right: 0px;
    content: "";
    display: block;
    position: absolute;
    border-top: 7px solid #ccc;
    border-right: 7px solid transparent;
	opacity:0.8;
}

.auction-on:after {
	border-top: 7px solid #afc272;
}

#countdown3,
#countdown2,
#countdown {
	display:inline-block;
	font-weight:600;
	z-index:999;
}

.ping-span {
	font-size:12px;
	font-weight:600;
	width:26px;
	height:26px;
	background:#9cb350;
	color:#FFF;
	border-radius:50%;
	position:absolute;
	padding-top:4.5px;
	top:-5px;
	right:-5px;
}

.auto-card-make-offer {
	position:relative;
	width:100%;
}

.auto-card-make-offer input {
	margin-bottom:0;
}

.auto-buyer-external-info {
	position:absolute;
	right:30px;
	bottom:35px;
}

/* WRAPPER */

#wrapper {
	overflow-x: hidden;
	position: relative;
	height: 100%;
	padding-top:90px;
}

img {
	max-width:100%;
}

/* SCROLLING TEXT */

#scrolling-text {
	overflow: hidden;
	white-space: nowrap;
	position: relative;
	background:#121212;
	color:#FFF;
	padding:10px;
}
  
#scrolling-text span {
	display: inline-block;
	animation: scrollLeft 100s linear infinite;
	font-family: roc-grotesk-wide, sans-serif;
	font-weight:500;
	font-size:20px;
} 

#scrolling-text span:before, #scrolling-text span:after {
	content: attr(data-content); /* This will use the data-content attribute's value as the content */
	display: inline-block;
	padding-left: 8px; /* Space between repetitions */
}

/* KUINKA */

#kuinka .feature-img-wrapper {
	height:100px;
	display:block;
}

#kuinka .feature-img-wrapper img {
	max-width:80px;
	max-height:80px;
}

/* CARDS */

.card {
	padding:30px;
	border-radius:6px;
	border:none;
	background:transparent;
	width:100%;
}

.card h4 {
	padding-bottom:15px;
}

.card p {
	font-size:15px;
}

.card > img:hover {
	cursor:pointer;
}

/* ORANGE */

.orange-bg {
	background:#fe6525;
	color:#FFF;
}

.orange-bg button:hover,
.orange-bg .button:hover {
	border:solid 1px #FFF;
}

.orange-bg h2 {
	color:#FFF;
}

.vauriopaku {
	margin-top:60px;
	width:95%;
}

/* FOOTER */

footer {
	background:#121212;
	color:#FFF;
}

.footer-contacts a {
	font-family: roc-grotesk-wide, sans-serif;
	font-weight:600;
	color:#FFF;
	font-size:38px;
	line-height:1.15em;
}

.footer-contacts a:hover {
	color:#fe6525;
}

.footer-symbol {
	width:120px;
	margin-bottom:30px;
	margin-top:30px;
}

.social-footer {
	padding:0 0 0 0;
	list-style-type:none;
	margin:0;
}

.social-footer li {
	display:inline-block;
	font-size:33px;
	margin:0 25px;
}

.footer-links a {
	color:#FFF;
	font-family: roc-grotesk-wide, sans-serif;
	font-weight:600;
}

.footer-links {
	max-width:1000px;
	margin:auto;
}

.footer-links a:hover {
	color:#fe6525;
}

.copyright-text {
	font-size:13px;
	opacity:0.75;
}

/* PAGE CONTENT */

#page-content h1 {
	padding-bottom:20px;
}

#page-content h2 {
	color:#121212;
	font-size:25px;
	margin-top:50px;
	padding-bottom:10px;
}

#page-content .container {
	max-width:1000px;
}

#page-content {
	padding-top:100px;
	padding-bottom:100px;
}

/* UKK */

#ukk .wpt-faq-question-text {
	font-weight:500;
	padding-top:3px;
}

#ukk .wpt-faq-question {
	border:none;
	border-radius:0px;
	padding:20px;
	background:transparent;
	
}

#ukk .wpt-faq-item {
	border-bottom:solid 2px #121212;
	margin-bottom:0;
	padding: 7px 0;
}

#ukk .wpt-faq-accordion ul.wpt-faq-accordion-list li div.wpt-faq-item[data-wpt-faq-state="open"] .wpt-faq-answer {
	padding:0 20px 20px 20px;
	background:transparent;
	border-radius: 0 0 0 0;
}

#ukk .wpt-faq-accordion ul.wpt-faq-accordion-list li div.wpt-faq-item[data-wpt-faq-state="open"] .wpt-faq-question {
	border-radius: 0 0 0 0;
}

/* NAV */

.navbar {
	opacity:1;
	width: 100%;
	box-shadow: none;
  }
  
  .nav-container {
	display: flex;
	justify-content: space-between;
	align-items: center;
  }
  
  .navbar .menu-items {
	display: flex;
  }
  
  .navbar .nav-container li {
	list-style: none;
  }
  
  .nav-container {
	display: block;
	position: fixed;
	top:0rem;
	right:0;
	z-index:999;
	pointer-events:none;
  }

  .nav-container > * {
	pointer-events:auto;
  }
  
  .nav-container .checkbox {
	position: absolute;
	display: block;
	height: 24px;
	width: 30px;
	top: 2.1rem;
	right: 2rem;
	z-index: 5;
	opacity: 0;
	cursor: pointer;
  }
  
  .nav-container .hamburger-lines {
	display: block;
	height: 24px;
	width: 30px;
	top: 2.1rem;
	right: 2rem;
	z-index: 2;
	position: absolute;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
  }
  
  .nav-container .hamburger-lines .line {
	display: block;
	height: 3px;
	width: 100%;
	border-radius: 0px;
	background: #121212;
  }
  
  .nav-container .hamburger-lines .line1 {
	transform-origin: 0% 0%;
	transition: transform 0.4s ease-in-out;
  }
  
  .nav-container .hamburger-lines .line2 {
	transition: transform 0.2s ease-in-out;
	width:100%;
  }
  
  .nav-container .hamburger-lines .line3 {
	transform-origin: 0% 100%;
	transition: transform 0.4s ease-in-out;
	width:100%;
  }
  
  .navbar .menu-items {
	padding-top: 0rem;
	height: 100vh;
	width: 390px;
	transform: translate(150%);
	background:#121212;
	display: flex;
	flex-direction: column;
	justify-content:top;
	padding-top:120px;
	padding-left:12px;
	padding-right:2rem;
	margin-left:0;
	-webkit-transition: all 450ms ease-in-out;
	-moz-transition: all 450ms ease-in-out;
	-o-transition: all 450ms ease-in-out;
	transition: all 450ms ease-in-out;
	text-align: center;
  }
  
  .navbar .menu-items li {
	margin-bottom: 0;
	font-size: 1rem;
  }

  .navbar .menu-items li a {
	display:block;
	color:#fff !important;
	text-align:left;
	font-size:1.5rem;
	font-weight:700;
	line-height:1;
	margin-bottom:1em;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
  }

  .navbar .menu-items li.margintopmenu {
	margin-top:2em;
  }

  .navbar .menu-items .sub-menu li a {
	color:#fe6525 !important;
  }

  .navbar .menu-items li a:before {
	content: '\f178';
	font: var(--fa-font-light);
	padding-right:0.5em;
	font-size:0.8em;
	opacity:0;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
  }

  .navbar .menu-items li a:hover {
	color:#fe6525 !important;
	margin-left:0.7rem;
  }

  .navbar .menu-items li a:hover::before {
	opacity:1;
  }
  
  .nav-container input[type="checkbox"]:checked ~ .menu-items {
	transform: translateX(0);
  }
  
  .nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line1 {
	transform: rotate(45deg);
	background:#fff;
	margin-top:0.01em;
  }
  
  .nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line2 {
	transform: scaleY(0);
	background:#fff;
  }
  
  .nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line3 {
	transform: rotate(-47deg);
	width:100%;
	background:#fff;
  }

  .nav-container input[type="checkbox"]:checked ~ .header-pyyda-tarjous {
	background:#fe6525;
  }
  
  .nav-container input[type="checkbox"]:checked ~ .logo{
	display: none;
  }
  .nav-container input[type="checkbox"]:checked ~ .language a,
  .nav-container input[type="checkbox"]:checked ~ .language {
	color:#121212;
  }
  .nav-container input[type="checkbox"]:checked ~ .language li.current-lang a {
	color:#fe6525 !important;
  }

.header-pyyda-tarjous {
	position: absolute;
	right: 30px;
	top: 23px;
	z-index: 9;
	min-width:240px;
	text-align:center;
	text-align: center;
    -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
         -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.logged-in-btn {
	z-index:999999999 !important;
	min-width:240px;
	text-align:center;
	-webkit-animation: fadein 0s; /* Safari, Chrome and Opera > 12.1 */
	-moz-animation: fadein 0s; /* Firefox < 16 */
	 -ms-animation: fadein 0s; /* Internet Explorer */
	  -o-animation: fadein 0s; /* Opera < 12.1 */
		 animation: fadein 0s;
}

.logged-in-btn i {
	display:inline-block !important;
}

/*header#main-header.scrolling .header-pyyda-tarjous {
	top:13px;
}
header#main-header.scrolling .nav-container .hamburger-lines,
header#main-header.scrolling .nav-container .checkbox {
	top:calc(2.1rem - 10px)
}
*/

header#main-header.scrolling .nav-container input[type="checkbox"]:checked ~ .header-pyyda-tarjous {
	border-color:#fe6525;
}

/*.progress-row .col-4:hover {
	cursor:pointer;
}

.progress-row .col-4:hover .progress-name {
	opacity:0.7;
}

.progress-row .progress-name {
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}*/

#main-header .menu-yhteys {
	list-style-type:none;
	padding:0 0 0 0;
	margin: 0 0 0 0;
	position:absolute;
	bottom:20px;
	text-align:left;
	left:30px;
	right:25px;
}

#main-header {
	position:fixed;
	top:0;
	z-index:10;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}

#main-header * {
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}

#main-header.scrolling {
	background:#121212;
}

#main-header.scrolling .button {
	border: solid 1px #FFF;
}

#main-header.scrolling .nav-container .hamburger-lines .line {
	background: #fff;
}

#main-header.scrolling img {
	filter: brightness(0) invert(1);
}

#main-header .menu-yhteys li {
	display:inline-block;
	margin:0 10px;
}

#main-header .menu-yhteys li a {
	color:#FFF;
	font-size:13px;
	padding:0 0 0 0;
	font-weight:600;
	margin:0;
}

#main-header .menu-yhteys li a i {
	margin-right:3px;
}


#main-header .menu-yhteys li a:hover i {
	color:#FFF;
}

#main-header .menu-yhteys li a:before {
	display:none;
}

#main-header .menu-yhteys li a:hover {
	padding:0;
	margin:0;
}

.register-link {
	color:#121212;
	font-weight:500;
	float:right;
}

.register-link:hover {
	color:#fe6525;
}

.register-link i {
	padding-right:5px;
}

/* FILTERS */

.slider-input {
    padding: 10px 20px 5px 20px !important;
    margin: 0px;
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 6px;
	float:left;
}

.filter-otsikko {
	margin-top:20px;
	padding-top:10px;
	display:block;
	font-weight:500;
	font-size:14px;
	text-align:left;
}

#vaurioauto-buyer .noUi-target {
    height: 6px;
}

#vaurioauto-buyer .noUi-handle {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    box-shadow: none;
    background: #fe6525;
    outline: none;
    border: none;
}

#vaurioauto-buyer .noUi-handle:focus {
    box-shadow: none;
}

#vaurioauto-buyer .noUi-connect {
	background: #ddd;
}

#vaurioauto-buyer .noUi-handle::after, 
#vaurioauto-buyer .noUi-handle::before {
	display:none;
}

.slider-input-row > div:last-child input {
	text-align:right;
	appearance: none; /* Modern browsers */
    -webkit-appearance: none; /* Chrome & Safari */
    -moz-appearance: none; /* Firefox */
}

.slider-input-row > div:last-child:before {
	content:'–';
	position:absolute;
	left:-5px;
	top:9px;
}

/* Hide arrows */
#vaurioauto-buyer input[type="number"]::-webkit-inner-spin-button,
#vaurioauto-buyer input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#vaurioauto-buyer {
	padding-bottom:80px;
}

#vaurioauto-buyer input[type="number"] {
    -moz-appearance: textfield; /* For Firefox */
}

#vaurioauto-buyer .noUi-horizontal .noUi-handle {
	right:-8px;
}

#vaurioauto-buyer .range-slider {
	width: calc(100% - 16px);
	margin: 10px auto;
}

#vaurioauto-buyer select {
	width:100%;
	border-radius:6px;
	background:#FFF;
	padding:10px 20px 7px 20px;
	border:solid 1px #ddd;
}

.select-container select {
	width:100%;
	border-radius:6px;
	background:#FFF;
	
	border:solid 1px #ddd;
}

#buyer-sidebar {
	padding-bottom:40px;
}

#buyer-sidebar h4 {
	font-size:20px;
	padding-bottom:20px;
	margin-top:33px;
}

.select-container,
.filter-dropdown {
    position: relative;
    display: inline-block;
	width:100%;
}

.select-container select,
.filter-dropdown select {
    appearance: none; /* Modern browsers */
    -webkit-appearance: none; /* Chrome & Safari */
    -moz-appearance: none; /* Firefox */
    background: #FFF;
    padding-right: 25px;
}

.select-container .fa-chevron-down {
	position: absolute;
    right: 20px;
    top: 42%;
    transform: translateY(-50%);
    pointer-events: none;
}

.filter-dropdown .fa-chevron-down {
    position: absolute;
    right: 20px;
    top: 40%;
    transform: translateY(-50%);
    pointer-events: none;
}

#buyer-cards .card img {
	width:100%;
	border-radius: 6px 6px 0 0;
}

#buyer-cards .card img.placeholder-img {
	opacity: 1;
    filter: grayscale(1) brightness(0.95);
}

#buyer-cards .card {
	padding:0 0 0 0;
	border:solid 0px #fff;
	background:#FFF;
	margin-bottom:30px;
}

#buyer-sidebar .fullwidth-btn {
	margin-top:30px;
}

#buyer-cards .status-btn-row a {
	background:#fe6525;
	border:solid 0px #121212;
	color:#fff;
	opacity:0.35;
	width:100%;
	border-radius:0 0 0 0;
	padding: 13px 10px 10px 10px;
	text-align: center;
}

#buyer-cards .status-btn-row > div {
	padding:0 0 0 0;
}

#buyer-cards .status-btn-row {
	padding:0 0 0 0;
	border:solid 0px #ddd;
	border-radius:6px;
	max-width:100%;
	margin-left:auto;
	margin-right:auto;
}

.car-card-details {
	width:100%;
}

.car-card-details tr td:last-child {
	text-align:right;
	font-weight:600;
}

.car-card-details table {
	width:100%;
}

#buyer-cards .status-btn-row > div:first-child a {
	border-radius: 6px 0 0 6px;
}

#buyer-cards .status-btn-row > div:last-child a {
	border-radius: 0 6px 6px 0;
}

#buyer-cards .status-btn-row a:hover {
	opacity:1;
}

#buyer-cards .status-btn-row a.router-link-active {
	opacity:1;
}

#buyer-cards .card-inner {
	padding:20px;
	font-size:14px;
}

.modal-header {
	border-bottom:none;
	padding: 2rem 2rem 0 2rem;
	display:block;
}

.make-an-offer {
	background: #eee;
	padding: 2.3rem 2rem 2rem 2rem !important;
	border-radius: 0 0 6px 6px;
	border-top:solid 1px #ddd;
}

.make-an-offer .car-card-otsikko {
	font-size:27px;
	padding-bottom:10px;
	color:#121212;
	text-align:center !important;
}

.make-an-offer-inner #register-next:hover {
	background:#d7e0b9;
	color:#121212;
}

.make-an-offer-inner {
	max-width:500px;
	margin:auto;
}

.modal-content {
	border:none;
	border-radius:6px;
}

.modal-dialog button.close {
	position: absolute;
	top: 0;
	right: 0;
	background: #121212;
	opacity: 1;
	color: #FFF;
	border-radius: 0 6px 0 6px;
	padding: 3px 0 0 0;
	text-shadow: none;
	width: 40px;
	height: 40px;
	z-index:99;
}

.modal-dialog button.close i {
	padding-left: 0 !important;
}

.modal-header .car-rekisteritunnus {
	left:auto;
	top:17px;
	right:40px;
}

.modal-header button.close:hover {
	color:#121212;
	background:transparent;
}

.modal-body {
	padding: 0 2rem 1.5rem 2rem;
}

.car-make-offer {
	text-align:left;
	margin-top:20px;
	font-size:18px;
	font-weight:600;
	color:#fe6525;
}

.car-make-offer a {
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
	margin-right:20px;
}

.car-make-offer .open-in-new-tab {
	position:absolute;
	right:0;
	color:#121212;
}

.car-make-offer .hide-car {
	position:absolute;
	right:32px;
	color:#121212;
}

.vauriotyyppi {
	background: #eee;
	padding: 10px;
	border-radius: 3px;
	text-align: center;
	display:block;
	margin-top: 20px;
}

.vauriotyyppi-modal i,
.vauriotyyppi i {
	padding-right:4px;
}

.car-make-offer a.car-module-link:hover {
	color:#121212;
}

.car-make-offer i {
	margin-left:5px;
	font-size:0.85em;
}

.car-card-otsikko {
	font-family: roc-grotesk, sans-serif;
	font-weight:600;
	font-size:18px;
	line-height:1.1;
	min-height:50px;
	text-align:left !important;
}

.card-inner .car-card-otsikko {
	padding-bottom: 10px;
}

.modal-dialog .car-card-otsikko {
	min-height:auto;
}

.login-row {
	width:auto !important;
	min-width:100% !important;
}

.car-card-otsikko i {
	color:#fe6525;
	display:inline-block;
	width:30px;
	text-align:center;
}

.car-module-details td {
	vertical-align:top;
	line-height:1.2;
	padding: 18px 10px 13px 10px !important;
	border-bottom:solid 1px #eee !important;
	font-size:14px;
}

tr.highlight .car-module-details td {
	background:transparent !important;
}

.car-module-details tr:last-child > td {
	border-bottom:none !important;
}

.car-module-details tr > td:first-child {
	font-weight:500;
	padding-right:15px;
	width:30% !important;
	border-radius: 3px 0 0 3px;
	color:#121212;
	line-height:1.2;
	text-align:right;
}

.car-module-details tr > td:last-child {
	width:70%  !important;
	border-radius:0 3px 3px 0;
}

.car-module-details {
	margin-bottom:40px;
	width:100%;
	margin-top:10px;
	background:rgba(255,255,255,0.6);
	max-width: 100%;
    table-layout: fixed;
}

.car-rekisteritunnus {
	position:absolute;
	left:10px;
	top:10px;
	border:solid 1px #fff;
	border-radius:3px;
	padding:4px 8px 3px 8px;
	line-height:1;
	background:#FFF;
	font-weight:700;
}

.modal-dialog {
    min-height: calc(100vh - 60px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
}

.input-error {
	width: 100%;
	display: block;
	margin-top: 5px;
	margin-bottom: 10px;
	background: transparent;
	font-size: 14px;
	padding: 7px 10px 3px 10px;
	border-radius: 3px;
	color:red;
	font-weight:500;
}

.input-error:before {
	content:"\f071";
	font-family: "FontAwesome";
    display: inline-block;
	color:red;
	margin-right:5px;
	font-weight:normal;
}

.forgotten-password {
	color:#121212;
	font-size:14px;
	float:right;
}

#company-register-app p {
	line-height:1.4;
	font-size:14px;
	padding-top:10px;
	display:block;
}

#company-register-app .thank-you-for-reg p {
	line-height:1.6;
	font-size:17px;
	padding-top:0px;
	display:block;
	margin-bottom:0;
}

#company-register-app .thank-you-for-reg h3 {
	font-size:22px;
	line-height:1.1;
}

.thank-you-for-reg {
	background: rgba(255,255,255,0.6);
    padding: 25px;
    border-radius: 6px;
}

.move-to-bid,
.logout-btn {
	margin-top:15px;
}

.logout-btn {
	margin-left:20px;
	background:transparent !important;
	border:solid 1px #121212;
	color:#121212;
}

.logout-btn:hover {
	color:#FFF !important;
	background:#121212 !important;
}

.header-button-col .button i {
	display:none;
}

.loading-overlay {
	position: fixed;
  height: 100vh;
  width: 100vw;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  justify-content: center;
  display: flex;
  align-items: center;
  background: rgba(255,255,255,0.7);
  backdrop-filter: blur(5px);
  z-index: 9999999;
}

.loading-overlay .fa-duotone {
	position: relative;
  font-weight: 900;
  letter-spacing: normal;
  font-size: 50px;
  color: #fe6525;
}

h3.offered-text {
	font-size: 30px;
    width: 750px;
    max-width: 100%;
    margin: 0 auto 10px auto;
	font-weight:400;
	font-family:'roc-grotesk',sans-serif;
}

a.info-circle:after {
	font-family: "FontAwesome";
    display: inline-block;
    content: "\f05a";
    font-size: 1em;
    position: absolute;
    left: -20px;
    top: 0px;
}

.offer-accepted i {
	font-size:80px;
	margin-top: 30px !important;
}

.offered-amount {
	padding-bottom: 0px !important;
	margin-bottom:0 !important;
    padding-top: 30px !important;
}

h3.offered-text {
	padding-top:50px;
}

/* BLOGI */

.blog-inner {
	width:720px;
	max-width:90%;
	margin:auto;
}

#page-content.blog-posts {
	width:1250px;
	max-width:100%;
	padding-left:0;
	padding-right:0;
}

#page-content.blog-posts .blog-more-to-read {
	text-align:center;
	padding-bottom:1.5rem;
	font-size:3rem;
	color:#121212;
}

#page-content.blog-container {
	width:1250px;
	max-width:100%;
	background: rgba(255,255,255,0.6);
	margin-top:40px;
}

#page-content.blog-container p {
	margin-bottom:1.75rem;
}

#page-content.blog-posts h5 {
	font-family: roc-grotesk-wide, sans-serif;
	font-weight:700;
	color:#121212;
}

#page-content.blog-container ul {
	margin-top:-0.5rem;
	padding-bottom:1.5rem;
}

.blog-title,
.blog-date {
	text-align:center;
}

.blog-title {
	margin-bottom:20px;
	color:#121212;
}

.blog-date {
	margin-bottom:10px;
	color:#fe6525;
	font-weight:600;
}

.blog-image img {
	width:100%;
	height:auto;
	margin-bottom:30px;
}

.blog-btn {
	margin-top:1rem;
}

.blog-posts .card {
	background:rgba(255,255,255,0.6);
	padding:0px;
}

.blog-posts .card-body {
	padding:1.5rem 1.5rem 3rem 1.5rem;
}

.blog-posts .text-muted {
	font-weight:600;
	color:#fe6525 !important;
	padding-bottom:0.5rem;
}

.blog-read-more {
	position:absolute;
	bottom:1.5rem;
	right:1.5rem;
	font-weight:600;
}

.blog-read-more i {
	padding-left:5px;
}

@media (min-width: 576px) {
	.modal-dialog {
	max-width: 700px;
	margin: 1.75rem auto;
	}
}

@media(max-width: 768px) {
  .modal-dialog {
    min-height: calc(100vh - 20px);
  }
}

@keyframes scrollLeft {
	0% {
	  transform: translateX(0%); 
	}
	100% {
	  transform: translateX(-100%); 
	}
}

@media (min-width: 1200px) {
	#buyer-sidebar {
		padding-right:40px;
	}
}

@media (min-width: 992px) {
	.offered-amount {
		font-size:85px !important;
	}
	#company-register-app .input-container {
		width:100%;
		margin-right:0%;
		float:left;
	}
	.progress-markkinointilupa {
		text-align:center;
	}
	#buyer-sidebar:after {
		content:'';
		border-left:solid 0px #ddd;
		position:absolute;
		right:13px;
		top:0;
		bottom:0;
	}
	.herofantti {
		position:absolute;
		width:50vw;
		top:200px;
		right:0;
		max-width:100vh;
	}
	.container {
		max-width:1250px;
	}
	#vaurioauto-buyer {
		padding-top:50px;
	}
	#main-header .container {
		max-width:100%;
	}
	.herofantti-mobile {
		display:none;
	}
}

@media (max-width: 992px) {
	.time-to-answer {
		font-size:14px !important;
	}
	.yes-thank-you {
		font-size:17px !important;
	}
	#page-content.blog-container { 
		margin-top:0;
		padding-top:30px;
		padding-bottom:50px;
	}
	.offered-amount {
		padding-bottom: 0px !important;
		padding-top: 20px !important;
	}
	h3.offered-text {
		font-size:22px;
	}
	#mainhero p {
		font-size:15px;
		line-height:1.5;
		margin-bottom:0;
	}
	#main-header .header-pyyda-tarjous {
		min-width:auto;
		display:none;
	}
	#main-header .header-pyyda-tarjous.logged-in-btn {
		display:inline-block;
	}
	#app {
		display:block;
		min-height:50vh;
	}
	.offered-amount {
		font-size:40px !important;
	}
	.offered-text {
		font-size:20px;
		margin-bottom:20px;
	}
	#mainhero h1 {
		margin-bottom:0;
	}
	#main-header .menu-yhteys {
		list-style-type: none;
		padding: 0 0 0 0;
		margin: 0 0 0 0;
		  margin-top: 0px;
		position: relative;
		bottom: auto;
		text-align: left;
		left: 22px;
		right: auto;
		margin-top: 20px;
	}
	.nav-container .checkbox,
  	.nav-container .hamburger-lines {
		right:15px;
		top:25px;
	}
	#wrapper {
		padding-top:100px;
	}
	#main-header .header-pyyda-tarjous {
		top: 16px;
		margin-right: 65px;
		text-align:right;
	}
	.logo {
		width: 100px;
		max-width: 1000%;
	}
	.symbol-nega,
	.symbol {
		width:60px;
		max-width:1000%;
		margin-left:-20px;
	}
	#app .container {
		padding-bottom:0;
		min-height:auto;
	}
	#mainhero h1,
	h1,h2 {
		font-size:30px;
	}
	#app h1 {
	font-size:30px;
	padding-top:0px;
	padding-bottom:10px;
	}
	header#main-header {
		padding-bottom:22px;
	}
	.header-button-col .button span {
		display:none;
	}
	.header-button-col .button {
		width:40px;
		height:40px;
		padding:10px 12px 10px 0;
		position:absolute;
		right:0;
		bottom:-5px;
	}
	#company-register-app {
		margin-top:20px;
	}
	.header-button-col .button i {
		padding-left:11px;
		font-size:18px;
		display:inline-block;
	}
	.herofantti {
		display:none;
	}
	.herofantti-mobile {
		position:relative;
		display:block;
		width:100%;
		padding-left:20%;
		top:0;
		margin-left:30px;
	}
	#mainhero h4 {
		padding-top:5px;
		font-size:14px;
	}
	header {
		padding-top: 20px;
		padding-bottom: 30px;
	}
	#app .container {
		border-radius: 0 0 0 0;
		padding:0 0 0 0;
	}
	.container-fluid {
		padding-left:0;
		padding-right:0;
	}
	body,html {font-size:16px;}
	.container {max-width:100% !important;}
	.progress-container h2 {
		font-size: 25px;
		padding:50px 0 10px 0;
	}
	.progress-container h2.thank-you-h2 {
		font-size: 40px;
  		padding-top: 0;
  		padding-bottom: 30px;
	}
	#kuinka .card {
		margin-bottom:10px;
	}
	#page-content {
		padding-top: 0px;
		padding-bottom: 30px;
	}
	#mainhero .container {
		min-height:auto;
		padding-top:0;
	}
	.question-row > div,
	.car-info-container .row > div {
		padding: 30px 35px;
	}
	.progress-container h4 {
		margin-top:40px;
	}
	.progress-container .pt-5 {
		padding-top:0 !important;
	}
	.progress-container {
		padding-bottom:50px !important;
	}
	.progress-name {
		padding-top: 15px;
		line-height: 1;
	}
}

@media (max-width: 768px) {
	.footer-contacts a {
		font-size:25px;
	}
	#buyer-cards .status-btn-row > div:first-child a,
	#buyer-cards .status-btn-row > div:last-child a {
		border-radius:0 0 0 0;
	}
	.car-module-details td {
		vertical-align:top;
		line-height:1.2;
		padding: 18px 10px 13px 10px !important;
		border-bottom:solid 1px #eee !important;
		font-size:14px;
	}
	
	.car-module-details tr > td:first-child {
		font-weight:500;
		padding-right:0px;
		width:100% !important;
		border-radius: 3px 0 0 3px;
		padding-bottom:0 !important;
		border-bottom:none !important;
		color:#121212;
		line-height:1.2;
		text-align:left;
		display:block !important;
	}
	
	.car-module-details tr > td:last-child {
		width:100%  !important;
		display:block !important;
		border-radius:0 3px 3px 0;
		padding-top:10px !important;
	}
}

@media (max-width: 470px) {
	.logout-btn {
		margin-left:0;
	}
	a.info-circle:after {
		font-family: "FontAwesome";
		display: inline-block;
		content: "\f05a";
		font-size: 1em;
		position: relative;
		left: auto;
		top: auto;
		margin-left: 5px;
	}
	.forgotten-password {
		float:none;
		display:block;
		text-align:center;
		margin-top:30px;
	}
	.register-link {
		float:none;
		display:block;
		text-align:center;
		margin-top: 40px;
		margin-bottom: 40px;
	}
	.hide-on-mobile {
		display:none;
	}
	.progress-container h4 {
		font-size: 18px !important;
	}
	.progress-name {
		font-size: 13px;
	}
	.progress-active {
		width: 70px;
		height: 50px;
		margin: auto;
		background: #F6F8EF;
		padding: 0 3px;
	}
	.progress-active img {
		margin-top: 4px;
		margin-left: -4px;
	}
	.card {
		padding:25px;
	}
	#ukk .wpt-faq-question {
		font-size:16px;
	}
	#ukk .wpt-faq-accordion ul.wpt-faq-accordion-list li div.wpt-faq-item[data-wpt-faq-state="open"] .wpt-faq-answer {
		font-size: 15px;
	}
	#register-next {
		position: relative;
		width: 100%;
		border-radius: 6px;
		padding: 15px 10px 13px 10px;
	}
	.nav-container {
		left:0;
	}
	.navbar .menu-items {
		width:100%;
	}
	.navbar .menu-items li a {
		font-size:1.35rem;
	}
	h1.pt-5 {
		padding-top:0 !important;
	}
	#main-header .menu-yhteys {
		list-style-type: none;
		padding: 0 0 0 0;
		margin: 0 0 0 0;
		margin-top: 0px;
		position: relative;
		bottom: auto;
		text-align: left;
		left: 15px;
		right: auto;
		margin-top: 20px;
	}
	.modal-header {
		padding:1rem 1rem 0 1rem;
	}
	.make-an-offer {
		padding: 2rem 1rem 1rem 1rem !important;
		border-radius: 0 0 6px 6px;
	}
	button,a.button {width:100%;text-align:center;}
	.modal-header button.close {
		width:auto;
	}
}

.noUi-target,.noUi-target *{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-ms-touch-action:none;touch-action:none;-ms-user-select:none;-moz-user-select:none;user-select:none;-moz-box-sizing:border-box;box-sizing:border-box}.noUi-target{position:relative}.noUi-base,.noUi-connects{width:100%;height:100%;position:relative;z-index:1}.noUi-connects{overflow:hidden;z-index:0}.noUi-connect,.noUi-origin{will-change:transform;position:absolute;z-index:1;top:0;right:0;height:100%;width:100%;-ms-transform-origin:0 0;-webkit-transform-origin:0 0;-webkit-transform-style:preserve-3d;transform-origin:0 0;transform-style:flat}.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin{left:0;right:auto}.noUi-vertical .noUi-origin{top:-100%;width:0}.noUi-horizontal .noUi-origin{height:0}.noUi-handle{-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute}.noUi-touch-area{height:100%;width:100%}.noUi-state-tap .noUi-connect,.noUi-state-tap .noUi-origin{-webkit-transition:transform .3s;transition:transform .3s}.noUi-state-drag *{cursor:inherit!important}.noUi-horizontal{height:18px}.noUi-horizontal .noUi-handle{width:34px;height:28px;right:-17px;top:-6px}.noUi-vertical{width:18px}.noUi-vertical .noUi-handle{width:28px;height:34px;right:-6px;bottom:-17px}.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle{left:-17px;right:auto}.noUi-target{background:#FAFAFA;border-radius:4px;border:1px solid #D3D3D3;box-shadow:inset 0 1px 1px #F0F0F0,0 3px 6px -5px #BBB}.noUi-connects{border-radius:3px}.noUi-connect{background:#3FB8AF}.noUi-draggable{cursor:ew-resize}.noUi-vertical .noUi-draggable{cursor:ns-resize}.noUi-handle{border:1px solid #D9D9D9;border-radius:3px;background:#FFF;cursor:default;box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #EBEBEB,0 3px 6px -3px #BBB}.noUi-active{box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #DDD,0 3px 6px -3px #BBB}.noUi-handle:after,.noUi-handle:before{content:"";display:block;position:absolute;height:14px;width:1px;background:#E8E7E6;left:14px;top:6px}.noUi-handle:after{left:17px}.noUi-vertical .noUi-handle:after,.noUi-vertical .noUi-handle:before{width:14px;height:1px;left:6px;top:14px}.noUi-vertical .noUi-handle:after{top:17px}[disabled] .noUi-connect{background:#B8B8B8}[disabled] .noUi-handle,[disabled].noUi-handle,[disabled].noUi-target{cursor:not-allowed}.noUi-pips,.noUi-pips *{-moz-box-sizing:border-box;box-sizing:border-box}.noUi-pips{position:absolute;color:#999}.noUi-value{position:absolute;white-space:nowrap;text-align:center}.noUi-value-sub{color:#ccc;font-size:10px}.noUi-marker{position:absolute;background:#CCC}.noUi-marker-sub{background:#AAA}.noUi-marker-large{background:#AAA}.noUi-pips-horizontal{padding:10px 0;height:80px;top:100%;left:0;width:100%}.noUi-value-horizontal{-webkit-transform:translate(-50%,50%);transform:translate(-50%,50%)}.noUi-rtl .noUi-value-horizontal{-webkit-transform:translate(50%,50%);transform:translate(50%,50%)}.noUi-marker-horizontal.noUi-marker{margin-left:-1px;width:2px;height:5px}.noUi-marker-horizontal.noUi-marker-sub{height:10px}.noUi-marker-horizontal.noUi-marker-large{height:15px}.noUi-pips-vertical{padding:0 10px;height:100%;top:0;left:100%}.noUi-value-vertical{-webkit-transform:translate(0,-50%);transform:translate(0,-50%);padding-left:25px}.noUi-rtl .noUi-value-vertical{-webkit-transform:translate(0,50%);transform:translate(0,50%)}.noUi-marker-vertical.noUi-marker{width:5px;height:2px;margin-top:-1px}.noUi-marker-vertical.noUi-marker-sub{width:10px}.noUi-marker-vertical.noUi-marker-large{width:15px}.noUi-tooltip{display:block;position:absolute;border:1px solid #D9D9D9;border-radius:3px;background:#fff;color:#000;padding:5px;text-align:center;white-space:nowrap}.noUi-horizontal .noUi-tooltip{-webkit-transform:translate(-50%,0);transform:translate(-50%,0);left:50%;bottom:120%}.noUi-vertical .noUi-tooltip{-webkit-transform:translate(0,-50%);transform:translate(0,-50%);top:50%;right:120%}.noUi-horizontal .noUi-origin>.noUi-tooltip{-webkit-transform:translate(50%,0);transform:translate(50%,0);left:auto;bottom:10px}.noUi-vertical .noUi-origin>.noUi-tooltip{-webkit-transform:translate(0,-18px);transform:translate(0,-18px);top:auto;right:28px}

#dropZone {
	display: flex;
	width: 100%;
	border: 2px dashed #666;
	align-items: center;
	justify-content: center;
	pointer-events: auto !important;
	padding: 2rem;
	border-radius:6px;
}

#dropZone .no-pointer {
    pointer-events: none;
}

#fileInput { 
  opacity: 0; /* make transparent */
  z-index: -1; /* move under anything else */
  position: absolute; /* don't let it take up space */
}

.upload-car-img {
	margin-right:40px;
	max-width:20vw;
}

.upload-thumbs {
	border: 2px dashed #666;	
	padding: 2rem;
	border-radius:6px;
	margin-top: 4px;
}

.thumb-container {
	margin-top: 30px;
	position: relative;
}

.thumb-remove {
	position: absolute;
	top: -12px;
	right: -12px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fe6525;
	color:#FFF;
	width: 32px;
	height: 32px;
	border-radius: 16px;
	font-size: 18px;
	line-height: 18px;
	cursor: pointer;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}

.thumb-remove:hover {
	background:#121212;
}

.thumb-default {
	position: absolute;
	bottom: 8px;
	left:8px;
	right:8px;
}

.thumb-image {
	cursor: pointer;
	background:#eee;
}

.thumb-default span {
	background-color: #121212;
	border-radius: 3px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing:0;
	color:#FFF;
	padding: 6px 12px 4px 12px;
	-webkit-box-shadow: 0px 26px 37px 0px rgba(255,255,255,1);
	-moz-box-shadow: 0px 26px 37px 0px rgba(255,255,255,1);
	box-shadow: 0px 26px 37px 0px rgba(255,255,255,1);
	width: 100%;
	display: block;
	text-align: center;
}

.thumb-default span.image-uploaded {
	background: #d7e0b9;
  	color: #121212;
}

.thumb-default span.image-upload-error {
	background:red;
	color:#121212;
}

.thumb-default span i {
	padding-right:3px;
}

#dropZone .button {
	margin-bottom:0;
}

#dropZone .button:hover {
	cursor:pointer;
}

.page-link {
	position: relative;
    display: block;
    padding: 12px 15px 10px 15px;
    margin-left: -1px;
    line-height: 1.4;
    color: #121212;
    background-color: #fff;
    border: 1px solid #ddd;
}

.page-link:hover {
	color:#000;
}

.page-link:focus {
	outline:none !important;
	box-shadow:none !important;
}
	
.page-item.disabled .page-link {
		color: #ccc;
}

.page-item.active .page-link {
	z-index: 1;
	color: #fff;
	background-color: #fe6525;
	border-color: #fe6525;
}

.pagination-row {
	padding-top:40px;
}

#buyer-cards .car-main-image img {
	border-radius:6px;
}

.car-gallery-thumbnails {
	text-align:left;
}

#buyer-cards .car-gallery-thumbnails img {
	width:80px;
	height:80px;
	margin:10px 10px 0 0;
	border-radius:6px;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}

#buyer-cards .car-gallery-thumbnails img:hover {
	transform:scale(1.02);
	cursor:pointer;
}

.modal-header .car-card-otsikko {
	margin-top:40px;
}

.thumb-image {
	height:200px;
  	object-fit: cover;
  	object-position: center center;
  	width: 100%;
  	border-radius:3px;
}

.buyer-table {
	width:100%;
}

.buyer-table tr {
	position:relative;
}

.buyer-table th,
.buyer-table td {
	padding: 20px 20px;
	font-size:14px;
}

.buyer-table th {
	background:#eee;
	line-height:1.2;
}

.buyer-table td {
	border-bottom:solid 1px #eee !important;
	line-height:1.1;
}

.buyer-table > tbody > tr:last-child > td {
	border-bottom:none;
}

.buyer-table thead th:last-child {
	text-align:center;
}

.buyer-table tr > td:last-child .info-circle {
	display: block;
    text-align: center;
}

.seller-row h1 {
	font-size:35px !important;
	line-height:1.2 !important;
}

.buyer-table {
	background:rgba(255,255,255,0.6);
	border-radius:6px;
}

.buyer-table thead tr > th:first-child,
.buyer-table tbody tr > td:first-child {
	width:15%;
}

.buyer-table thead tr > th:nth-child(2),
.buyer-table tbody tr > td:nth-child(2) {
	width:20%;
}

.buyer-table thead tr > th:nth-child(3),
.buyer-table tbody tr > td:nth-child(3) {
	width:10%;
}

.buyer-table thead tr > th:nth-child(4),
.buyer-table tbody tr > td:nth-child(4) {
	width:15%;
}

.buyer-table thead tr > th:nth-child(5),
.buyer-table tbody tr > td:nth-child(5) {
	width:30%;
}

.table-input-container {
	position:relative;
	margin:0;
}

/*#offer-container:after {
	content: '€';
    position: absolute;
    left: 80px;
    bottom: 11px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;
}*/

#offer {
    padding-right: 20px; /* Initial padding to accommodate the euro sign */
}

/* For Chrome, Safari, Edge, Opera */
input#offer::-webkit-outer-spin-button,
input#offer::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* For Firefox */
input#offer[type=number] {
    -moz-appearance: textfield;
}


#offer::placeholder {
    text-align: right; /* Aligns the placeholder to the right */
}

.buyer-table .text-input {
	margin-bottom:0;
}

.info-circle {
	line-height:1.1 !important;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
	position:relative;
}

.info-circle i {
	padding-left:4px;
}

.loading-text {
	margin-top:30px !important;
	font-size:20px !important;
	display:block !important;
	text-align:center !important;
}

.info-circle:hover {
	opacity:0.7;
}

.toteutunut-info i {
	color:#9cb350;
	padding-right:3px;
	padding-left:0;
}

.ei-toteutunut-info i {
	color:#9cb350;
	padding-right:3px;
}

.viivastyi-btn,
.ei-toteutunut-btn,
.toteutui-btn {
	display:block;
	width:100%;
	border-radius:6px;
	margin-bottom:6px;
	margin-right:6px;
	text-align:left;
	padding:16px 25px 14px 25px;
	font-family:roc-grotesk,sans-serif;
	font-weight:600;
	letter-spacing:0;
	background:#FFF;
	border:solid 1px #ccc;
	color:#121212;
}

tr.highlight td {
	background:rgba(215, 224, 185,0.35) !important;
}

tr.highlight {
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
}

.toteutui-btn:hover,
.ei-toteutunut-btn:hover,
.viivastyi-btn:hover {
	background:#FFF;
	color:#444;
}

.tapahtuma-td {
	font-family:roc-grotesk,sans-serif;
	font-weight:600;
	letter-spacing:0;
}

.viivastyi-btn i,
.ei-toteutunut-btn i,
.toteutui-btn i {
	padding-right:3px;
	color:#fe6525;
	font-size:1.2em;
}

.viivastyi-btn i,
.ei-toteutunut-btn i,
.kontaktoi-btn i,
.toteutui-btn i {
	padding-right:3px;
	padding-left:0;
}

.kontaktoi-btn {
	margin-bottom:5px;
	background:#d7e0b9;
	color:#121212;
	border-radius: 6px;
	border:solid 1px #d7e0b9;
	width:100%;
	font-size:13px;
}

.modal-dialog {
	text-align:left !important;
}

.customer-contact {
	background: #eee;
	padding: 2rem !important;
	border-radius: 0 0 6px 6px;
	border-top:solid 1px #ddd;
	margin-top: 20px;
}
.customer-contact-inner {
	max-width:500px;
	margin:auto;
}

.picture-blog {
	position: absolute;
    bottom: 4px;
    background: transparent;
    color: #444;
    padding: 4px 10px 2px 10px;
    right: 19px;
    border-radius: 3px;
    font-size: 12px;
	font-weight:400;
	border: dashed 0px #444;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}

.picture-blog i {
	margin-right:4px;
}

.picture-blog:hover {
	color:#000;
}

/* VAURIO ANIMATION */

@keyframes clipAnimation {
    from {
        clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    }
    to {
        clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    }
}

.svg-icon {
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    animation: clipAnimation 4s forwards;
	fill:#fe6525;
	position:absolute;
	max-width:250px;
}

.svg-icon-grey {
	fill:#333;
	position:absolute;
	max-width:250px;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.progress-container-fade-in {
	animation: fadeIn 1s ease;
	animation-delay:2s !important;
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

.background-animation {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #121212;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
	animation: fadeIn 1s ease, fadeOut 1s ease 3s forwards;
}

@media screen and (max-width: 981px) {
	#page-content.blog-posts .blog-more-to-read {
		font-size:1.8rem;
	}
	#dropZone {
		display:block;
		padding: 20px 20px 50px 20px;
	}
	#dropZone .upload-car-img {
		margin-bottom:20px;
	}
	textarea {
		min-height:220px;
	}
	table.buyer-table {
	  border: 0;
	}
	.yrityksille-fantti {
		display:none;
	}
	table.buyer-table caption {
	  font-size: 1.3em;
	}
	
	table.buyer-table > thead {
	  border: none;
	  clip: rect(0 0 0 0);
	  height: 1px;
	  margin: -1px;
	  overflow: hidden;
	  padding: 0;
	  position: absolute;
	  width: 1px;
	}
	
	table.buyer-table > tbody > tr {
	  box-shadow: 0px 23px 14px -14px rgba(0,0,0,0.06);
	  display: block;
	  margin-bottom: 40px;
	}
	
	table.buyer-table > tbody > tr > td {
	  border-bottom:solid 1px #eee !important;
	  display: block;
	  font-size: .8em;
	  text-align: right;
	}
	
	table.buyer-table > tbody > tr > td::before {
	  /*
	  * aria-label has no advantage, it won't be read inside a table
	  content: attr(aria-label);
	  */
	  content: attr(data-label);
	  float: left;
	  font-weight: 700;
	  text-transform: none;
	}
	
	table.buyer-table > tbody > tr > td:last-child {
	  border-bottom: 0;
	}
	table.buyer-table > tbody > tr > td {
		width:100% !important;
		background: #FFF;
	}
	.buyer-table tr > td:last-child .info-circle {
		display: block;
		text-align: right;
	}
	.car-module-details > tr > td:last-child {
		text-align:left;
	}
	.buyer-table {
		background:transparent;
	}
}

.error-div h2 {
	padding-bottom:0.5rem !important;
	font-size:2.5rem !important;
}

.error-div p {
	font-size:1.15rem !important;
	line-height:1.6;
	padding-bottom:20px !important;
}

@media(max-width: 480px) {
	.error-div h2 {
		padding-bottom:0 !important;
		font-size:1.5rem !important;
	}
	.error-div p {
		font-size:1rem !important;
		line-height:1.6;
		padding-bottom:20px !important;
	}
	.upload-car-img {
		margin-right: 40px;
		max-width: 30vw;
		margin-bottom: 20px;
	}
	.navbar .menu-items {
		padding-left:0;
	}
}

@media(max-width: 360px) {
	.picture-blog {
		font-size:11px;
	}
	.picture-blog i {
		display:none;
	}
}

@media(max-width: 340px) {
	.car-module-details td {
		font-size:12px;
	}
}

.car-main-image-with-zoom {
	position: relative;
}

.car-main-image-with-zoom .car-image-zoom-container {
	position: absolute;
    right: 0.75rem;
    bottom: 0.5rem;
    height: 2.5rem;
    width: 2.5rem;
    border-radius: 999999px;
    background-color: #fe6525;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}

.car-main-image-with-zoom .car-image-zoom-container:hover {
	cursor: pointer;
	opacity:0.8;
}

.car-main-image-with-zoom .car-image-zoom-container .car-image-zoom-icon {
	color: #fff;
}

.offered-div {
	background: rgba(255,255,255,0.6);
    padding: 10px 5px 20px 5px;
    margin-bottom: 15px;
	margin-top:20px;
    box-shadow: 0px 23px 14px -14px rgba(0,0,0,0.06);
    border: solid 2px #fe6525;
	border-radius:6px;
}

.progress-container h2.h2-offer-accepted {
	padding-bottom: 0 !important;
    padding-top: 35px !important;
}

.progress-container .paragraph-offer-accepted {
	margin-bottom:0 !important;
}

.manual-register-plate {
	text-transform:uppercase;
	font-size:20px;
	font-family:'roc-grotesk-wide', sans-serif;
	font-weight:700;
	text-align:left;
}

.manual-headline {
	font-size:20px;
	font-family:'roc-grotesk-wide', sans-serif;
	font-weight:700;
	text-align:left;
}

.manual-headline i,
.manual-register-plate i {
	padding-right:0.25em;
	color:#fe6525;
}

@media screen and (max-width: 981px) {
	.manual-headline {
		font-size:19px;
		margin-top:30px;
		text-align:center;
	}
}