html { 
 
}
html.start {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

body {	
	/*line-height: 20px;
	font-size: 12px;*/
	background-color: transparent;
	padding: 0px;
}

#contentContainer {
	padding: 10px;
}
@media (max-width: 1014px) {
	#insearch, #finInputGlobal {
		height: 43px;
		line-height: 38px;
		padding-left: 8px;
		padding-right: 8px;
	}
}

.btn-black {
    color: #000;
    background-color: transparent;
    border-color: #000;
    transition: background-color .5s,border-color .5s;
}

.btn-black:hover, .btn-black:focus, .btn-black:active, .btn-black.active, .open .dropdown-toggle.btn-black {
    color: #d5001c;
    background-color: transparent;
    border-color: #d5001c;
    transition: background-color .5s,border-color .5s;
}

.calc div.row {
	margin-bottom: 10px;
}

span.modelLbl {
	font-size: 10px;
}
a.selectedCat {
	background-color: #8895A5;
	background-image: url("CloseDropdown.gif");
	background-position: right center;
	background-repeat: no-repeat;
	border: 1px outset #8895A5;
	color: #FFFFFF;
	display: block;
	font-family: Arial, Geneva, sans-serif;
	font-size: 11px;
	margin-bottom: 1px;
	padding: 2px 4px 1px;
	text-align: left;
	text-decoration: none;
	width: 100%;
	margin-top: 2px;
}
a.selectedCat:Hover {
	background-color: white;
	background-image: url("CloseDropdownHover.gif");
	color: #8895A5;
	text-decoration: none;
}
div.contentBorder {
	padding-top: 12px;
	padding-bottom: 54px;	
	margin-top: 12px;	
	background-color: white;
}
#ajoverlay {
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	width: 100px;
	height: 60px;
	text-align: center;
	line-height: 50px;
	background-color: #FFFFFF;
	border: 1px solid #DEDEDE;
	color: white;
	position: absolute;
	margin-left: auto;
	margin-top: auto;
	z-index: 12000;
}
#noco {
	z-index: 1000;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	width: 200px;
	height: 150px;
	text-align: center;
	line-height: 25px;
	background-color: #FAFAFA;
	border: 1px solid #336799;
	color: white;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -50px;
	margin-top: -50px;
	color:black;
}
#noco span {
	display: block;
	margin-top: 8px;
}
#noco button {
	margin-top: 12px;	
}
select,input {
	font-size: 11px;
	margin-bottom: 10px;
}
select.pleaseSelect, option.pleaseSelectOption {
	color: #CC0000;
}

option.standardOption {
	 color: #555555;
}

a.thumbLink {
	text-decoration: none;
	color: black;
}
a.thumbKatLink {
	text-decoration: none;
	color: black;
}
div.thumbKat {
	background-color: #CCCCCC;
	height: 208px;
	margin-top: 12px;
	margin-bottom: 12px;
	width: 306px;
}
div.thumbKatHi {
	background-color: #CCCCCC;
	height: 200px;
	margin-top: 12px;
	margin-bottom: 12px;
	width: 298px;
	border: 4px solid #CC0000;
}
div.thumbKat span {
	margin-left: 6px;
	padding-top: 4px;
	padding-bottom: 4px;
	display: block;
    height: 40px;
}
div.thumbKat img {
	border: none;
	width: 4px;
	height: 7px;
	padding-right: 4px;
}
div.thumbKat img.thumbKat, img.thumbKat {
	padding-left: 4px;
	padding-right: 4px;
	height: 154px;
	width: 298px;
}
div.thumbKatHi img.thumbKat {
	padding-left: 0px;
	padding-right: 0px;
}
#hint {
	background-color: #CCCCCC;
	height: 30px;
	margin-left: none;
	padding-left: 24px;
	padding-right: 12px;
	padding-top: 6px;
}
#hint a {
	color: black;
	text-decoration: none;
}
#hint img {
	border: none;
}
div.footerlink {
	height: 100%;
}
span.footertext {
	padding-left: 8px;
}
div.thumbprice {
	background-color: #CCCCCC;
	position: relative;
	bottom: 14px;
	height: 20px;
	text-align:right;
	padding-right:5px;   
}
div.thumbprice span {
	margin-left: 6px;
	padding-top: 4px;
	padding-bottom: 4px;
}

div.productrow {
	border-bottom: 1px solid #CCCCCC;	
	margin-bottom: 12px;
	padding-bottom: 12px;
}

div.artrowall {
	margin-bottom: 0px;	
}

div.artrow {
	border-top: 1px solid #CCCCCC;
	width: 100%;
	padding-top: 39px;
	padding-bottom: 73px;
}

div.firstartrow {
	border-top: 1px solid #CCCCCC;		
}

#galleria {
	height: 300px;
	max-width: 575px;
}
a.bluebtn, a.bluebtn:Hover, a.bluebtnnoimg, a.bluebtnnoimg:Hover {
	color:white;
	text-decoration: none;	
	height: 30px;
	background-color:#8895A5;
	display: block;
	padding-left:6px;
	color:white;
	vertical-align:middle;
}
a.onlyimg, a.onlyimg:Hover {
	padding-left:0px;
	width: 32px;	
}
a.bluebtnnoimg {
	padding-right: 6px;
}
a.bluebtnnoimg div {
	height: 30px;
	padding-top:5px;
}
div.artsave {
	display: none;
	width: 250px;
	height: 250px;
	border: 4px solid #CCCCCC;
}
div.artsave span.title {
	color: #CC0000;
	font-weight: bold;
	padding-left: 6px;	
}
div.artsave span.desc {
	display: block;
	margin-top: 6px;
	padding-left: 6px;
}
#noart {
	display:none;
}
.artp {
	display:none;
}

.galleria-lightbox-close {
	font: 42px/48px arial,sans-serif !important;
	width: 50px !important;
	height: 50px !important;
}
div.mail {
	margin: 10px;
	border: 1px solid #CCCCCC;
    padding: 10px;
}
div.mail h2 {
	margin-top: 10px;
}
.mailinput {
	float: left;
	padding-right: 20px;
}

.mailimage {
	padding-top: 18px;
}

div.mail div.info {
	margin-bottom: 10px;
	font-size: 12px;
}
div.mail div.invalid, div.calc div.invalid {
	margin-bottom: 12px;
	font-size: 16px;
	color: #CC0000;
}
.send {
	width:220px;
	margin-top: 24px;
}
.asterisk {
	font-weight: bold;
	color: #CC0000;
}
div.thumbPDF {
	vertical-align:top;
}
div.thumbPDF img.thumbKat {
	width: 306px;
	height: 162px;
	float:left;
	margin-right:12px;
}
span.titlePDF {
	color: #336799;
	font-size: 20px;
	font-weight:bold;
	vertical-align:bottom;
}
table.tblPDF {
	border-color: #CCCCCC;
	margin-bottom: 24px;
	border: 0 0 0 1px;
}
div.valPDF {
	display:block;
	margin-bottom:6px;
}
span.infoPDF {
	line-height: 20px;
	margin-bottom: 12px;
	display: block;
}
div.thtitle {
	display: block;
	height:40px;
	line-height:40px;
	position: relative;
	padding-left: 8px;
	padding-right: 8px;	
	overflow:hidden;
	top: 0px;			
}
div.thumbKatHi div.thtitle {
	height:36px;
	line-height: 36px;
}
div.thtext {
	display: block;
	background-image: url(arrow-black.gif);
	background-position: 3px center;
	background-repeat: no-repeat;
	height: 40px;
    overflow: hidden;
    white-space: nowrap;
    width: 270px;
    position: relative;
    padding-left: 12px 
}
div.thumbKatHi div.thtext {
	height: 36px;
}
div.thfader {
	background: url("verlauf-ltr-font.png") repeat-y scroll 0 0 transparent;
	position: absolute;
	height: 14px;
	width: 35px;	
	right: 11px;
	top: 12px;
	z-index: 1000;
}
figure.fixedratio {
  padding-top: 56.25%;  /* 450px/800px = 0.5625 */
  background-size: cover;
  -moz-background-size: cover;  /* Firefox 3.6 */
  background-position: center;  /* Internet Explorer 7/8 */
  margin: 0px !important;
}
              
/* Calculate fluid ratio based on two dimensions (width/height) */
@mixin fluid-ratio($large-size, $small-size) {
  $width-large: nth($large-size, 1);
  $width-small: nth($small-size, 1);
  $height-large: nth($large-size, 2);
  $height-small: nth($small-size, 2);
  $slope: ($height-large - $height-small) / ($width-large - $width-small);
  $height: $height-small - $width-small * $slope;

  padding-top: $slope * 100%;
  height: $height;

  background-size: cover;
  -moz-background-size: cover;  /* Firefox 3.6 */
  background-position: center;  /* Internet Explorer 7/8 */
}
              
figure.fluidratio {
  /* This element will have fluid ratio from 4:1 at 800px to 2:1 at 300px. */
  @include fluid-ratio(1024px 768px, 300px 150px);
}
input.search-query {
	margin-top: 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	padding-top: 5px;
	padding-bottom: 6px;
	height: 17px;
	font-size: 11px;	
}

.navbar {
	margin-left: 0px;
	margin-right: 0px;
}

.navbar.show-search { margin-top: 17px; }

.navbar .navbar-inner {
	background-color: #333333;	
	background-image: linear-gradient(to bottom, #333333, #222222);
}	

.navbar-inner {
	min-height: 30px;
	border-radius: 0;
	padding-left: 10px;
}

.navbar .container {
	width: auto;
	margin-left: 10px;
}
nav.ps-sidenav .ps-sidenav-title.ps-sidenav-inverted {
	background-color: #494e51;
	border-color: #494e51;
	line-height: normal;
	top: unset !important;
}
nav.ps-sidenav .ps-sidenav-title.ps-sidenav-inverted:after {
	background: transparent;
}

.addToRemoveFromList {
	margin-top: 12px;
	margin-bottom: 12px;
	white-space: nowrap;
	page-break-inside: avoid;
}
.calcbtn {
	white-space: nowrap;
	page-break-inside: avoid;
}
#textMerkliste {
	margin-right: 5px;
}

.backBtn {
	background-image: url("arrow-black-left.gif");
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 9px;
	color: black;
}

.backBtn:hover {
	text-decoration: none;
	color: #CC0000;
}

.backBtn:visited {	
	color: black;
}

#merklisteShowSmall a {
	color: black;
}

#merklisteShowSmall a:hover {
	text-decoration: none;
}

.furterinfoimg {
	margin-left: 5px;
}
#bprint {
	page-break-inside: avoid;
	white-space : nowrap;	
}
@media (max-width: 767px) {
	#bprint, #bmail {
		margin-bottom: 5px;
	}
}

@media (min-width: 768px) {
	.navbar-fixed-bottom {
	    position: fixed;
	}
}

span.searchArtNr {
	background-color: #CC0000;
	color: white;	
}
span.selectedModel {
	font-weight:bold;
}

/*
 	#################################################################################
	Mobile Country Selector
	#################################################################################
*/

div.mcon div.mcont {
	padding-bottom:0px !important;
	padding-right: 0px !important;
	padding-left: 0px !important;
}
div.mcon #mnom {
	margin-bottom:0px !important;
} 
#mnom img {
	max-height: 236px !important;
}
div.mcon div.msel {
	background-color: #F7F7F7 !important;
	padding-top:12px !important;
}

/*
 	#################################################################################
	Internet Country Selector
	#################################################################################
*/

body.icon {
	background-color: #E7EBED;
	min-height: 100%;
	height: 100%;
}

div.con {
	background-position: left top;
    height: auto !important;
    margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
    position: relative;
    text-align: left;
    width: 1063px;
    background-color: #FFFFFF;	
    min-height:100%;
}
div.con #contentContainer {
	background-image: url('country_selector.jpg');
	height: 470px;	
}
div.cont {
	padding-top:0px !important;
}

#selch {
	width: 250px;
	background-image: url('white-20.png');
	background-repeat: repeat;
	margin-left: 28px;
	padding: 12px;
	height: 450px;
}
#selch div.row {
	margin:0px;
	padding-top: 32px;
	height: 340px;
	width: 100%;
	background-image: url('white-50.png');
	background-repeat: repeat;
}
div.inselch {
	width:100%;
	height: 100%;	
}
div.inselch select {
	width: 150px;
}
div.ibg {
	height: 79px;
	background-color: white;
}
div.wel {
	position:relative;
	bottom: 84px;
	left: 610px;
}
.imgLeft {
	max-width: none !important;
}
.moreModels {display:none;}
.amdetails, .amdetails:visited {
	color: #333333;
	text-decoration:underline;
}
.amdetails:hover {
	color: #CC0000;
}
div.calc {
	margin: 10px;
	border: 1px solid #CCCCCC;
    padding: 10px;
}
.arthighlight {color: #CC0000;}
h6.calc {margin-bottom:0px;}
div.calcdesc {
	margin-bottom: 8px;
	font-size: 10px;
}
div.calcsum, #calcsum {
	margin-bottom: 8px;
}
div.calctext { 
	height: 20px;
	vertical-align: middle;
	padding-top: 4px;
}
div.calc div.span4 {
	margin-left: 0px;	
}
div.calc div.span8 {
	margin-left: 0px;	
}
#bggray, #sonstigesRowprintLbl {
	background-color: #eff0f1;
}
div.calc div.row {
	margin-left:0px;
	padding-left:6px;
}
div.summe {
	font-weight: bold;
}
.placeholder {color:#aaa;}
input {color:black;}
#linkpdf {color:#FFFFFF;}
#linkpdf:Hover {color:#FFFFFF; text-decoration:none;}
#linkpdf:Focus {color:#FFFFFF; text-decoration:none;}
#linkpdf img {margin-top:-6px;}
#linkpdfimg {display:none;}


/*
		porsche.com Redesign Buttons
*/
/*
.btn {
    margin: 0 4px 4px 0;
}
.btn-default {
    background-color: #3e4146;
    border-color: #3e4146;
    color: #fff;
    transition: background-color 1s ease 0s, border-color 1s ease 0s;
}

.btn {
    -moz-user-select: none;
    background-image: none;
    border-radius: 2px;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
  	line-height: 1.5;
    padding: 6.5px 14px;
    position: relative;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}
*/

.merklisteBeschreibung {
	margin-top: 24px;
	margin-bottom: 24px;
}

span.lbl {
	font-family: ArialMT !important;
	font-weight: bold;
	font-size: 10px;
	line-height: 12px;
}
span.valPDF {
	font-family: ArialMT !important;
	font-size: 10px;
	font-weight: normal;
	line-height: 12px;
}

.footnote {
	font-family: ArialMT !important;
	font-size: 8px;
	line-height: 10px;
}

#selectInvertError div.select2-container
 {
	background-color: #494e51;
}

#selectInvertError .form-control.select2-container-multi:after {
	color: white;
}

.calc-bg-gray {
	background-color: #eff0f1;
}

.form-control-static {
	background-color: #e3e4e4;
	border-radius: 0;
}