/* Nettix Pro Styles */

#main-nettix {
	margin: 0 auto 0 auto;
    display: grid;
    padding-bottom: 40px;
    padding-top: 40px;
}

.page-nettix #main-nettix {
    background: #ffffff;
}

.button, .content-box-gray  .woocommerce a.button, .woocommerce div.product form.cart .button {
    display: inline-block;
    color: #ffffff;
    background: #940000 !important;
    padding: 10px 20px;
    border: none;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
    border-radius: 0;
}

.button.list-all {
    color: #940000 !important;
    background: #ffffff !important;
    float: right;
}

.content-box-gray .woocommerce a.button {
    width: 100%;
}

#main-nettix .button:hover, #main-nettix .button:active, #main-nettix .button:focus {
	color: #ffffff;
	text-decoration: none;
	background: #940000;
}

.rahoitus {float:right; width: 280px; margin: 0px 10px;}

.rahoitus .inner {background-color: #fff;padding: 1em;height: 100%;overflow: hidden;}

.rahoitus h2 {font-size:1.2em;font-weight:bold;padding:0.5em;margin-top:0;color: #fff;background: #242422;}

.rahoitus img {
	margin-bottom: 5px;
}

.rahoitus .nimi {
	margin-bottom: 16px;
}

.notice {clear:both;padding:1em;font-weight: bold;}
.notice.success {background-color: lightgreen;}
.notice.error {background-color: lightcoral;}

#main-nettix .vehicledetails {
	max-width: 1000px;
    margin: 0 auto;
}

.autot a {
	text-decoration: none;
}

div.auto {
    border-radius: 0;
    position: relative;
    margin: 10px;
    float: left;
    color: #000;
    background-image: linear-gradient(to bottom, #f4f4f4 50%, #fff 100%);
    line-height: 1.33em;
    cursor: pointer;
    padding: 0px;
    height: 375px;
    width: 316px;
    overflow: hidden;
    box-sizing: border-box;
    font-size: 13px;
    font-weight: 700;
    text-align: left;
    /* box-shadow: 0 3px 29px 0 rgba(106,107,108,0.18); */
    box-shadow: 0 3px 29px 0 rgba(106,107,108,0.4);
    transition: all .4s ease-in-out;

}

div.auto:hover {
	-webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

div.auto a {
	text-decoration: none;
}

.vehicle-image-container {
	width: 100%;
	text-align: center;
	margin: 0;
	padding: 0;
	height: 220px;
    overflow: hidden;
    /*background-position: center center;*/
	background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

.auto img.vehicle-image {
	transition: border-color 0.5s;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	width: 100%;
}

.auto-inner {
	padding: 0.5em 1em;
	color: #000;
}

.auto .car-price {
	text-align: left;
}

.car-price {
    position: relative;
	color: #000000 !important;
    font-size: 30px;
    line-height: normal;
    margin-bottom: 8px;
    font-weight: 900;
}

.car-price .price-per-month {
    position: absolute;
    top: 12px;
    right: 0;
    font-size: 18px;
    display: block;
    text-align: right;
    color: #940000;
}

.auto .make-model {
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.04em;
    margin-bottom: 6px;
}

span.trim {
    font-weight: 400;
    font-size: 12px;
}

.auto .slogan {
	display: block;
	margin: 0.7em 0 0.7em;
	font-weight: 300;
    font-size: 1.1em;
}

.auto .year-mileage {
	list-style: none;
	list-style-type: none;
	position: absolute;
    bottom: 13px;
}

.auto div {clear: both;}
.auto label {float: left;clear: left;margin: 0;}

tr.auto .tyyppi {display:block;font-size: 0.8em;}
.auto .hinta,.auto .vuosimalli,.auto .mittarilkm {display: inline-block;float: left;margin-left: 5px;}
.auto img.uusi {position: absolute;border:none;box-shadow: none;margin:2px 0 0 2px;}
.auto td.vehicle-name {padding-left: 1em;}
.auto.more-cars:hover {background-color:transparent;box-shadow: none;}
.auto.more-cars a {display:block;font-size:2.5em;font-style: italic;line-height: 1.1em;box-shadow: 0px 2px 4px rgba(100, 100, 100, 0.8);border: 2px solid #fff;margin-bottom:0.5em;width:100%;background-color: #f0f0f0;color: #4d535f;height: 54%;padding: 1.6em 0;text-align: center;text-decoration: none;}
.auto.more-cars a:hover {background-color: #000;color: #000;}
tr.auto .slogan {margin-top:0;}
.auto .banner-new-car {
	position: absolute;
    padding: 10px 140px 7px 20px;
    font-size: 1.3em;
    text-transform: uppercase;
    background-color: #940000;
    color: #ffffff;
    font-weight: bold;
    text-align: center;
    margin-left: -14px;
    margin-top: -12px;
    /* border: 2px solid #fff; */
    border-left: none;
    border-radius: 12px 0px;
    transform: rotate(-20deg);
	text-transform: lowercase;
}

/* Compact Vehicle List */

.car-list-compact div.auto {
    height: 315px;
    width: 210px;
}

.car-list-compact .vehicle-image-container {
    height: 135px;
}

.car-list-compact .car-price {
    font-size: 24px;
}

.car-list-compact .auto .make-model {
    font-size: 18px;
}

.car-list-compact .auto .banner-new-car {
    padding: 5px 120px 5px 18px;
    font-size: 1em;
}

#control-bar {
	overflow: hidden;
	margin: 0 auto 2em;
	max-width: 400px;
}

#control-bar div.list-type, #control-bar div.list-order {
	display: block;
	font-size: 18px;
	font-weight: 700;
    text-transform: uppercase;
    color: #ffffff
}
#control-bar div.list-type {
	margin-right: 2em;
}
#control-bar h1 {
	float: left;
	margin:0;
	padding:0;
}

#control-bar select {
	width: auto;
}

table.autot {
    width: 100%;
}

table.autot td {
    width: auto;
    vertical-align: middle;
}

table.autot td:first-child {
    width: 64px;
}
table.autot tr:hover td {
	background-color: 940000;
	cursor: pointer;
}

span.list_link {
    margin-right: 10px;
}

table.autot th {
    background: #000;
    padding: 3px 0;
    width: auto;
}

.page-auto {
    width: 1080px;
}

.page-ostamme .ui-widget .ui-widget-content {
    height: auto;
}

.vehicledetails h1 {
	text-align: left;
    color: #000000;
    font-weight: 700;
    font-size: 32px;
    margin-bottom: 5px;
    margin-top: 10px;
}

.vehicledetails .hinta {
    text-align: right;
}

.vehicledetails .iso-hinta {
    font-size: 32px;
    font-weight: 700;
	color: #000000;
}

span.rahoitusesimerkki {
    font-size: 14px;
}

.vehicledetails .alv-vahennys {
	margin-right: 1em;
}

.vehicledetails label {
    display: inline-block;
    clear: left;
    margin: 0;
}
.vehicledetails .merkki, .vehicledetails .malli, .vehicledetails .tyyppi, .vehicledetails .ajoneuvolaji {
    display: inline-block;
}
.vehicledetails .mittarilkm {
    font-weight: bold;
}

.vehicledetails .slogan {
    font-family: 'Open Sans',sans-serif;
    display: block;
	clear: both;
	background-color: rgba(255, 255, 255, 0);
    padding: 0;
    font-style: normal;
    border-radius: 0;
	border: 0;
    font-size: 14px;
    white-space: pre-line;
    word-break: break-word;
}

span.updating {
    color: #bbb;
}

.clear {
    clear: both;
}

.image-box {
    display: block;
}

.car-thumbnail {
    margin: 5px 5px 0 0;
    padding: 0;
    background-color: transparent;
    width: 106px;
    height: 72px;
    float: left;
    border: 0;
    border-radius: 0;
    box-shadow: 0px 2px 4px rgba(100, 100, 100, 0.5);
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

.car-thumbnail:hover {
	border-color: #940000;
}
.car-thumbnail img {
	position: absolute;
	width: 100%;
}

img#main-image {
    margin: 15px 0 5px 0;
    width: 100%;
    float: none;
    border: 0;
    border-radius: 0;
    box-shadow: 0 3px 8px rgba(100, 100, 100, 0.5);
    cursor: pointer;
}

.vehicledetails h3 {
	font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    color: #000000;
    border-bottom: 2px solid #940000;
    padding-bottom: 3px;
}

.vehicledetails h2 {
	text-align: center;
	font-weight: 700;
    margin-top: 0;
}

.info {width: 100%;}
.perustiedot .col {min-width:250px; width: 48%;float: left;display: inline-block;}
.perustiedot .col:nth-of-type(2n+1) {float:right;}
.perustiedot .col > div {border-bottom: 1px solid #940000;overflow: hidden;height:32px;}
.perustiedot label {float:left;padding-top: 12px;font-weight: 400;}
.perustiedot span {padding-top: 7px;float:right;text-align: right;}
.perustiedot input#down_payment {margin-top:-5px;width: 80px;text-align: right;padding: 3px;}
.perustiedot .col .nice-select {height: 26px; line-height: 14px;}

.accessories {
	-moz-column-count: 3;
	-webkit-column-count: 3;
	column-count: 3;
}
.accessories ul {
	clear: both;
	margin: 0;
	padding-left: 20px;
}

.accessories li {
	list-style: none;
	position: relative;
    margin-bottom: 2px;
    font-size: 90%;
}

.accessories li::before {
    content: "•";
    color: #940000;
    transform: translateX(-200%);
    display: inline-block;
    position: absolute;
}

.content-box-gray {
	display: table;
	padding: 15px;
    margin-bottom: 15px;
	background-color: #f0f0f0;
	margin-top: 30px;
	width: 100%
}

.content-box-gray h3 {
	margin-top: 0;
}

.credit-box {
	font-size: 90%;
}

#module {
	width: 100%;
	display: table;
}

#module a.collapsed {
	color: #000000;
}

#module div.collapse[aria-expanded="false"] {
	display: block;
	height: 7px !important;
	overflow: hidden;
}

#module div.collapsing[aria-expanded="false"] {
	height: 7px !important;
}

#module a.collapsed:after  {
	content: '+ Näytä lisää';
}

#module a:not(.collapsed):after {
	content: '- Näytä vähemmän';
}

.monthly {
	font-size: 22px;
	color: #000000;
	font-weight: 700;
	margin-top: 7px;
}

.monthly label {
	padding-top: 7px;
	font-weight: 700;
}

#finance_duration {margin-top:-5px;text-align: right;min-width: auto;display: inline;}

/*.contact .contact-row {overflow: hidden;}*/
.contact {background: #f0f0f0; padding: 1.5em; margin-top: 30px;}
.contact label {float:left;padding-top: 10px;height: 55px;}
.contact span {float:right;width: 60%;}
.contact span label {padding: 0;font-weight: 400;float:right;width: auto;border: none;margin-left:2%;}
.contact input[type=checkbox],.contact input[type=radio] {margin: -4px 5px 0 5px; width: auto;}
.contact input[type=text], .contact select {float:right;width: 50%;height: 42px;border: solid 1px #e3e3e3;min-width: auto;}
.contact .contact-row .nice-select {float: right; width: 50%; min-width: auto; margin-top: -55px;}

.financing table, .financing input.button {
	float: left;
}

.credit-table td {
	padding:0.5em;
}
.credit-table tr td:nth-of-type(2n+1) {
	font-weight: bold;
}
.credit-table tr td:nth-of-type(2n) {
	width: 130px;
	text-align: right;
}
.credit-table .highlight td {
	font-size: 1.2em;
}
.credit-results {
	margin-top: 2em;
	float:left;
	clear: both;
	overflow: hidden;
}

h3.search-form-title {
	font-size: 30px;
    font-weight: 600;
    text-transform: uppercase;
	margin-bottom: 30px;
	text-align: center;
}

#module-search {
	width: 100%;
	display: table;
}

#module-search div.collapse[aria-expanded="false"] {
	display: block;
	height: 7px !important;
	overflow: hidden;
}

#module-search div.collapsing[aria-expanded="false"] {
	height: 7px !important;
}

#module-search a.collapsed:after  {
	content: '+ Laajennettu haku';
}

#module-search a:not(.collapsed):after {
	content: '– Laajennettu haku';
}

/** hakusivu & ostamme **/
#search_form {margin:-0.5em;}
#purchase_form textarea {height: 100px;}
.results,  .buttons {clear: both; padding: 0 0.5em;}
.results {
	margin:1em 0;
	font-size: 1.5em;
	line-height: 1.2em;
    font-weight: 700;
    color: #ffffff
}
.ui-widget {
	float:left;
	padding: 0.5em;
    font-size: 13px;
    font-family: 'Open Sans', sans-serif;
    letter-spacing: -0.02em;
}
.ui-widget .ui-widget-header {
    background: #940000;
    border-radius: 0;
    color: #ffffff;
    font-weight: 700;
    text-transform: uppercase;
    padding: 5px 12px;
}
.ui-widget .ui-widget-content {
    overflow: hidden;
    border-top: none !important;
    padding: .5em;
    background: #ffffff;
    height: 185px;
}
.ui-widget .alt-height {
    height: 150px !important;
}

#purchase_form .ui-widget .ui-widget-content {
    height: 70px;
}
.ui-widget ul {list-style: none;margin:0;padding:0;}
.ui-widget li {float:left;width: 150px;margin:0;padding:0;}
.ui-widget .ui-widget-content input[type="text"],
.ui-widget .ui-widget-content select,
.ui-widget .ui-widget-content textarea {width: 100%;margin:0;}
.ui-widget .ui-widget-content select {padding:2px;}
.ui-widget .ui-widget-content select option {padding:1px;}
/*.ui-widget ul.body_types li {padding:15px;height:100px;}*/
.ui-widget.w100 {width:100%;}
.ui-widget.w50 {width:50%;}
.ui-widget.select-list {width:25%;}
.select-list + .select-list + .select-list {width:25% !important;}
.ui-widget.w25 {width:25%;}
.w50 .ui-widget-content, .w25 .ui-widget-content {}
.ui-widget.w100 li {width: 25%;min-width: 150px;}
.ui-widget.w50 li {width: 50%;}
.ui-widget.w25 li {width: 100%;}
.ui-widget.select-list .ui-widget-content {padding:0;}
.ui-widget.select-list .ui-widget-content .list {
    padding: 7px;
    width: 100%;
    height: 185px;
    overflow: auto;}

.ui-widget.select-list li {width: 100%;cursor:pointer;}
.ui-widget.select-list li.selected {background-color: lightblue;}
.ui-widget.select-list li:hover {background-color: lightgray;}

.ui-widget label {font-weight: 400;}

#down_payment {width: 80%;}

.page-template-page-autohaku-nettix #main input, .page-template-page-ostamme-autosi-nettix #main input {
	width: auto;
}

.page-template-page-autohaku-nettix #main input[type="text"], .page-template-page-ostamme-autosi-nettix #main input[type="text"] {
    padding: 0.1em 1em;
    width: 100% !important;
}

section#recent-vehicles {
    margin-top: 30px;
    padding-bottom: 10px;
}

 /* input.required, select.required {border:1px solid #242422;background-color: #fed;} */

 /* imageLightBox */
#imagelightbox {
	box-shadow: 0 0 3.125em rgba( 0, 0, 0, .75 );
    position: fixed;
    z-index: 9999;
}
#imagelightbox-loading,
#imagelightbox-loading div {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
#imagelightbox-loading {
    width: 2.5em; /* 40 */
    height: 2.5em; /* 40 */
    background-color: #444;
    background-color: rgba( 0, 0, 0, .5 );
    position: fixed;
    z-index: 10003;
    top: 50%;
    left: 50%;
    padding: 0.625em; /* 10 */
    margin: -1.25em 0 0 -1.25em; /* 20 */

    -webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
    -moz-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
    box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
}
#imagelightbox-loading div {
    width: 1.25em; /* 20 */
    height: 1.25em; /* 20 */
    background-color: #fff;

    -webkit-animation: imagelightbox-loading .5s ease infinite;
    -moz-animation: imagelightbox-loading .5s ease infinite;
    -o-animation: imagelightbox-loading .5s ease infinite;
    animation: imagelightbox-loading .5s ease infinite;
}
@-webkit-keyframes imagelightbox-loading {
    from { opacity: .5;	-webkit-transform: scale( .75 ); }
    50%	 { opacity: 1;	-webkit-transform: scale( 1 ); }
    to	 { opacity: .5;	-webkit-transform: scale( .75 ); }
}
@-moz-keyframes imagelightbox-loading {
    from { opacity: .5;	-moz-transform: scale( .75 ); }
    50%	 { opacity: 1;	-moz-transform: scale( 1 ); }
    to	 { opacity: .5;	-moz-transform: scale( .75 ); }
}
@-o-keyframes imagelightbox-loading {
    from { opacity: .5;	-o-transform: scale( .75 ); }
    50%	 { opacity: 1;	-o-transform: scale( 1 ); }
    to	 { opacity: .5;	-o-transform: scale( .75 ); }
}
@keyframes imagelightbox-loading {
    from { opacity: .5;	transform: scale( .75 ); }
    50%	 { opacity: 1;	transform: scale( 1 ); }
    to	 { opacity: .5;	transform: scale( .75 ); }
}
#imagelightbox-overlay {
    background-color: #fff;
    background-color: rgba( 255, 255, 255, .9 );
    position: fixed;
    z-index: 9998;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.ui-widget .ui-widget-header {
	border: none;
}

.ui-widget-content {
	border: none !important;
}

/** jQuery UI Dialog **/
.ui-dialog {box-shadow: 0px 10px 10px rgba(100, 100, 100, 0.5);}
.ui-dialog h1 {font-size: 1.2em;}
.ui-dialog h1 .date {font-weight: normal; color: #888;margin-right: 0.5em;}
.ui-dialog-titlebar {display:none;}
.ui-dialog .ui-widget-content {border:none;}
.ui-dialog .news-image {max-width: 300px;float:left;margin-right: 1em;}

#resp-frontpage {display:none;}
.responsive {display: none;}

/** media queryt responsiivisuutta varten **/

@media screen and (min-width: 1400px) {
    .container.page-nettix {width: 1370px;}
    .container.page-nettix .col-sm-12 {padding-left: 0; padding-right: 0;}
}

@media screen and (min-width: 1200px) {
    .container {width: auto;}
}

@media screen and (max-width: 1170px) {
    .page-template-page-auto-nettix .container.page-nettix {background-color: #ffffff;}
}

@media screen and (min-width: 1100px) {
    .page-template-page-auto-nettix .container.page-nettix {width: 1060px;}
}

@media screen and (max-width: 960px) {
	/* yleiset */
	#main-nettix, #control-bar, .floating {width: 100%;}
	#control-bar {padding:0 14px;}
	#list_type {display: none;}
	/* auton sivu */
	.car-thumbnail {float: left;width:23%;height:0;padding-bottom:15% !important;margin:1% !important;}
	.car-thumbnail:nth-of-type(4n+1) {margin-left:0;}
	
	/* rahoitus-sivun widget */
	.rahoitus {position:relative; width: 97%; margin: 30px 0px; }
	
}

@media screen and (max-width: 767px) {
	#main-nettix {margin: 0 auto 0 auto; display: block;}
	.contact .contact-row .nice-select {float: none;  width: 100%; margin-top: auto;}
	.contact label {height: 35px;}
	.vehicledetails h1 {font-size: 24px;}
	.vehicledetails .hinta {text-align: left;}
	.buttons input, .buttons a {font-size: .8em;}
	.accessories {
		-moz-column-count: 2;
		-webkit-column-count: 2;
		column-count: 2;
    }
    
    .tm-mobi {margin-top: 30px;}
}

@media screen and (max-width: 650px) {

	/* autohaku & ostamme */
	.results, .buttons {position: fixed;
		background-color: #fff;
		width: 100%;
		padding: 1em;
		z-index: 40;
		margin:0;
		left:0;
	}
	.results {
		bottom: 61px;
		padding-bottom: 0;
		width: 100%;
        font-size: 14px;
        border-top: solid 1px #940000;
	}
	.buttons {bottom:0;z-index: 9;}
	#search_form {overflow:hidden;margin-bottom:60px;}
	#purchase_form {overflow: hidden;margin-bottom: 40px;}
	.ui-widget.w100 li {width:33%;}
	.ui-widget.select-list {width:50%;}
	.select-list + .select-list + .select-list {width: 50% !important;}

	h3.search-form-title {font-size: 20px;}

	#control-bar div.list-type, #control-bar div.list-order {font-size: 14px;}
}

@media screen and (max-width: 580px) {
	
	/* etusivu ja ajoneuvolistaus */
    div.auto, .car-list-compact div.auto {width:100%; margin: 1em 0; height: 300px; float: left;}
    div.auto {height: 360px;}
	.new {overflow:hidden; margin: 2em 0;}
	.auto img.vehicle-image {width: 100%; max-height: inherit;}
	

	/* auton sivu */
	.contact .contact-row {border:none;margin-bottom:1em;}
	.contact label {width: 100%;}
	.contact span {float:left;width: 100%;}
	.contact span label {float:left;width: auto;}
	.contact input[type=text], .contact select {float:left;width: 100%;}
	.contact input[type=submit] {font-size: 1.5em;}
	.perustiedot .col {float: left;width: 100%;}

	/* autohaku & ostamme */
	.ui-widget.w100 li {width: 50%;}
	.ui-widget.w50 {width: 100%;}
	.ui-widget.w25 {width: 50%;}
	
	.vehicle-image-container {
        background-position: center top;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .buttons input, .buttons a {
        width: 32% !important;
        margin: 0;
        float: left;
        text-align: center;
    }

    .button {padding: 10px 10px !important;}
}

@media screen and (max-width: 440px) {
	div.financing .button {margin:1em 0 !important;}
}

@media screen and (max-width: 380px) {

	/* autohaku & ostamme */
	.ui-widget.w100 li {width: 100%;}
	.ui-widget {width:100% !important;}
    .perustiedot input#down_payment {width: 50px;}
}