@charset "utf-8";
/* CSS Document */
html{
	margin-top:0px !important;
}
@media screen and (min-width: 1920px){
	.navBlockWrap {
		left: 50%;
		margin-left: -965px;
	}
}

#scrollBlocker {
	width:100%;
	height:100%;
	left:0;
	position:fixed;
	overflow:hidden;
	top:0px;
	z-index:999;
}

.mobileMenuSlide{
	width:270px;
	background:#fff;
	position:fixed;
	left:-270px;
	top:0;
	z-index:300;
	height: 100%;
	background:#e5e8e7;
	-webkit-transition: left .5s; /* Safari */
    transition: left .5s;
	z-index:99999;
}
.mmOuterWrap{
	padding-right:15px;
	background:#fff;
	height:100%;
	padding-bottom: 15px;
	border-right:1px solid #e5e8e7;
	border-bottom: 1px solid #e5e8e7;
}
.mmInnerWrap{
	background:#e5e8e7;
	height:100%;
	overflow-x:hidden;
	overflow-y:auto; 
}
.mobileMenuSlide ul li{
	list-style-type:none;
	background: none;
}
.mobileMenuSlide ul li a{
	background:none;
	padding:11px 14px;
	display: block;
	font-family: "Audi Type Ext";
	font-size:11px;
	line-height:48px;
	border-left:2px solid #e5e8e7;
	border-right:1px solid #e5e8e7;
}
.mobileMenuSlide ul li a:hover, .mobileMenuSlide ul li a.active{
	background:#fff;
	border-left:2px solid #cc0033;
	color:#000;
}
.mainWrap.slideActive, .interiorWrap.slideActive{
	position:relative;
	left:270px;
}
.mainWrap.slideActive{
	overflow:hidden;
	/*height:100vh;
	width:100vw;*/
}
.mobileMenuSlide.slideActive{
	left:0;
}
.header.slideActive{
	-webkit-transform: translateZ(0);
	left:270px;
}
/*body.slideActive{
	overflow-x:hidden;
	overflow-y:hidden;
	position:relative;
	top:0;
	height:100%;
	width:100%;
}*/
body.slideActive .mobileScrollFix{
	position:relative;
	width:100vw;
	overflow:hidden;
}

@media screen and (min-width: 1920px) {
	.mainWrap{
		width:100%;
		max-width:1920px;
		margin:0 auto;
	}
	.sectionWrapFlip, .header{
		width:100%;
		/*max-width: 1920px; */
		max-width: 100%;
	}
	.header{
		left:auto;
		max-width:1920px;
	}
}

/*@media screen and (max-width: 1478px) {
	.heroText, .blockWrap{
    	margin-left: 240px;
	}
	.footer{
		padding-left:240px;
	}
	.navBlockWrap, ul.navBlock li a{
		width: 150px;
	}
	.homeFooterWrap{
		padding-left:111px;
	}
}*/
@media screen and (max-width:1560px){
	.elementController{
		width:10px;
	}
	.carController{
		width:20px;
		height:20px;	
	}
	.carSliders{
		top:175px;
	}
	.thumbControllers {
		height: 70px;
		position: relative;
		top: 135px;
	}
	
}
@media screen and (max-width: 1493px){
	.gridBox{
		width:30%;
	}
	.tireRow{
		height:auto;
	}
	.tireCell{
		float:none;
		width:auto;
		height:auto;
		margin-bottom:20px;
	}
}
@media screen and (max-width: 1400px){
	ul.navBlock li a{
		font-size:13px;
		width:200px;
		white-space:nowrap;
	}
	/*.featureBlock{
		width:280px;
	}
    .homeNewsBlock{
        width:560px;
    }*/
	.sectionWrapOne .homeLink a{
		margin-right:133px;
	}
	.homeLink a{
		margin-right:133px;
	}
	.heroLinks {
    	width: 264px;
	}
	.gridImg{
		height:123px;
	}
	.carSliders{
		top:155px;
	}
	.thumbControllers {
		height: 70px;
		position: relative;
		top: 120px;
	}
	.serviceHistory{
		width: 100%;
		box-sizing: border-box;
	}
	.accordion-toggle,
	.accordion-content {
		width: 100%;
	    box-sizing: border-box;
	}
}
@media screen and (max-width: 1368px){
	.gridBox{
		width:28%;
	}
	.stickerImg{
		width:100%;
	}
	.youtubeContent{
		width:100%;
		box-sizing:border-box;
	}
	.grayedInfo{
		width:100%;
		height:auto;
		overflow: auto;
	}
}
@media screen and (max-width: 1310px){
	.thumbControllers {
		height: 70px;
		position: relative;
		top: 115px;
	}
	.gridBox{
		width:50%;
	}
}
@media screen and (max-width: 1276px) {
	.vinRight {

		 margin-left: 0; 
		clear: both;
	}
	#push_down_block{
		margin-top: 280px;
	}
}
@media screen and (max-width: 1250px){
	/*.featureBlock{
		width:250px;
	}
    .homeNewsBlock{
        width:500px;
    }*/
	.gridImg{
		height:100px;
	}
	.carSliders{
		top:135px;
	}
	.thumbControllers {
		height: 70px;
		position: relative;
		top: 110px;
	}
}
@media screen and (max-width: 1130px){
	.thumbControllers {
		height: 70px;
		position: relative;
		top: 105px;
	}
	
}

@media screen and (max-width: 1128px) {
	.heroText h1{
		font-size: 30px;
		margin-left: 0;
	}
	a.backBtn.backClose{
		margin-top:38px;
	    font-size: 18px;
		padding-left: 25px;
	    background-size: 14px 22px;
	}
	a.backBtn.backClose:hover {
		background: url(../images/backArrowRed.png) no-repeat;
		background-size: 14px 22px;
	}
	.search-overlay, .search-drop {
		display: none;
	 }
	span.search-result-title {
    	font-size: 22px;
	}
	.results-wrapper {
		margin: 60px 0;
	}
	.search-result {
    	padding-bottom: 30px;
    	margin-bottom: 40px;
	}
	.interior .homeLink a{
		margin-right: 145px;
	}
	.navBlockWrap, .magGlass, #searchForm{
		display:none;
	}
	.mobileMenu{
		display:block;
		padding:16px;
	}
	.header{
		padding:0;
		height: auto;
		border-bottom:1px solid #fff;
	}
	.homeLink {
    	padding: 10px 10px 10px 45px;
	}
	
	.heroText, .blockWrap{
		margin-left:15px;
	}
	.blockWrap{
     	margin: 0 auto;
	}
	.topHero{
		padding-top: 45%;
    	height: 0;
	}
	.heroText{
		margin-top: 30px;
		position: absolute;
		top: 50px;
	}
	.heroText a[target="_blank"]{
		margin-top:15px;
	}
	.fLapButtonRevised{
		padding: 15px 14px;
	}
	.heroLinks, .sectionWrapTwo{
		padding-top:30px;
	}
	.flipContentWrap{
		/*overflow:hidden;*/
		width: 100%;
    	box-sizing: border-box;
        padding: 30px 15px 0 15px;
	}
	.sectionWrapFlip a{
		display:inline-block;
		float: left;
    	clear: both;
	}
	.sectionWrapFlip{
		padding-bottom: 30px;
		/*min-height: 0;*/
		/*height:auto;*/
		margin-top: 15px;
	}
	/*.featureBlock{
		width:31%;
	}
    .homeNewsBlock{
        width:62%;
    }*/
	.footer{
		padding-left:15px;
		margin-top:15px;
	}
	.footerLeft{
		width:220px;
	}
	.linkWrap {
   		margin-top: 0;
	}
	.footerRight {
    	width: 50%;
	}
	.heroLinks {
    	width: 180px;
		position: absolute;
		top: 50px;
		right: 0px;
	}
	.sectionWrapTwo{
		min-height:0;
		padding: 30px 15px 0 15px;
		width: 100%;
    	box-sizing: border-box;
	}
	.sectionWrapFlip{
		width:100%;
	}

	h1{
		font-size: 23px;
	}
	h2{
		font-size:19px;
	}
	h3{
		font-size:14px;
		margin: 10px 0;
	}
	.heroText, .heroBold{
		font-size:28px;
	}
	.flipBtnWrap{
		top: 50px;
		right:16px;
	}
	.homeLink a, .sectionWrapOne .homeLink a{
		margin-right:30px;
	}
	.interior .homeLink a, .sectionWrapOne .homeLink a{
		margin-right:25px;
	}
	.interiorWrap{
		padding-top:53px;
	}
	.homeFooterWrap{
		padding-left:0px;
		padding-right:0px;
	}
	#leftcolumn{
		margin-left:15px;
	}
	#contentcolumn {
   		margin-left: 352px;
		margin-right:15px;
	}
	.leftPad {
    	padding: 0 15px;
	}
	.backClose{
		margin-right:15px;
	}
	.leftWrapper {
    	margin-right: 412px;
	}
	.interiorRight {
    	width: 396px;
	}
	.newsBlock{
		padding: 30px 26px;
	}
	.flipBlock{
		min-height: 600px;
    	height: 100%;
	}
	.flipContentWrap h1 {
    	padding-right: 30px;
	}
	.gridImg{
		height:80px;
	}
	/*.screenShot{
		max-width:400px;
	}*/
	
}
@media screen and (max-width: 900px) {
	span.search-result-title {
		font-size: 18px;
	}
}
@media screen and (max-width: 1024px) {
	.sectionWrapFlip, .back{
		height:100vh !important;
		/*max-height:1024px;*/
	}
	.back{
		padding-bottom:30px;
	}
	.header, .mainWrap{
		width:100%;
	}
	.gridImg{
		height:99px;
	}
	.carSliders{
		top:125px;
	}
	.mobileTable tr td,
	.mobileTable tr th,
	.mobileTable tr{
		font-size:9px;
	}
	.thumbControllers {
		height: 70px;
		position: relative;
		top: 100px;
	}
	.vid-controls{
		left:0px !important;
	}
	.mobileTable td:nth-child(4), .mobileTable td:nth-child(5){
		padding-left:30px;
	}
}
/*@media screen and (max-width: 1024px) {
	.sectionWrapFlip, .back{
		height:100%;
		max-height:1024px;
	}

}*/
@media screen and (max-width:1191px){
	.rightTable{
		margin-left:0px;
	}
	.floaterLeft{
		margin-top:20px;
	}
}
@media screen and (max-width:1128px){
	.back{
		padding-bottom: 55px !important;
	}
}
@media screen and (max-width: 980px) {
	table.serviceHistory thead tr th:first-of-type {
		width: 190px;
	}
}
@media screen and (max-width: 843px) {

	.leftWrapper {
    	margin-right: 332px;
	}
	.interiorRight {
    	width: 316px;
	}
	.newsBlock{
		padding: 20px 16px;
	}
	.interiorNavWrap{
		padding: 50px 26px 30px 26px;
	}
	.resourcesWrap {
    	padding: 40px 26px 30px 26px;
	}
	.gridImg{
		height:84px;
	}
	.carSliders{
		top:105px;
	}
	.thumbControllers {
		height: 70px;
		position: relative;
		top: 95px;
	}
}
/*@media screen and (max-width: 760px){
	.homeLink a{
		background:url(../images/audiCPOLogo_Rings.png) no-repeat;
		width:73px;
		margin-right:17px;
	}
}
@media screen and (max-width: 686px) {
	.links{
		margin-top:13px;
	}
}*/
@media screen and (max-width: 760px) {
	a.heroLinkCustom{
		border: 1px solid #1f1c1b;
	}
	a.heroLinkCustom:hover{
		color:#fff;
		background:#1f1c1b !important;
	}
	.contactSection {
    	width: 55%;
	}
	.homeLink a, .sectionWrapOne .homeLink a{
/*		width:73px;*/
		margin-right:17px;
	}
	.mainWrap{
		width:100%;
	}
	.topHero{
		height: 161px;
    	position: relative;
		padding-top:20%;
	}
	
	.heroText {
    	margin-top: 171px;
		position: relative;
		top: auto;
	}
	
	.heroText h1{
		font-size:26px;
		color:#000 !important;
	}
	.fLapBtnWhite.fLapButtonRevised {
		background: #000;
    	border: 1px solid #000;
	}
	.fLapBtnWhite.fLapButtonRevised:hover{
		background: #fff !important;
	}
	.fLapBtnWhite.fLapButtonRevised span{
		color: #fff;
	}
	.fLapBtnWhite.fLapButtonRevised:hover span{
		color: #000 !important;
	}
	.standings_cta{
		color: #000;
		
	}
	.standings_cta:after{
		background: url(../images/arrowSprite.png) no-repeat right bottom;
	}
	.standings_cta:hover{
		color: #000;
		border-bottom: 1px solid #000;
	}
	.standings_cta:hover:after{
		content: "";
		display: inline-block;
		width: 11px;
		height: 9px;
		background: url(../images/arrowSprite.png) no-repeat right bottom;
		margin-left: 8px;
	}
	
	
	
	
	.heroLinks{
		float: left;
		clear: both;
		margin-left: 15px;
		padding-top: 20px;
		position: relative;
		top: auto;
	}
	.sectionWrapTwo{
		padding-top:20px;
	}
	.featureBlock h2{
		padding-bottom:15px;
		margin-bottom: 0px;
	}
	.featureBlock{
		margin-bottom:20px;
		width: 100%;
		box-sizing: border-box;
		max-width:none;
	}
	.blockWrap.hpFlexBlock.noFeature .featureBlock {
		width: 100%;
		max-width: none;
	}
	.blockWrap.hpFlexBlock.noFeature .featureBlock.trainingBlock {
		max-width: none;
	}
	.heroText, .heroBold{
		font-size:18px;
	}
	p, .heroText p{
		/*font-size:12px;*/
		color: #000;
		font-size: 14px;
    	line-height: 22px;
	}
	ol li, ul li{
		font-size: 14px;
    	line-height: 22px;
	}
	body ul{
		margin:10px 0;
	}
ul li{
	background: url('/wp-content/themes/audicpo/images/list_bullet.png') no-repeat 0px 9px;
}
	.heroLinks a, a.heroLinkCustom {
		font-size:10px;
	}
	h2 {
    	font-size: 16px;
	}
	h3{
		font-size:13px;
	}
	a.backBtn.backClose {
		display: block;
		position: relative;
		margin-top: -15px;
	}
	.results-wrapper {
		margin: 40px 0;
	}
	.featureBlock .moreLink {
    	margin-top: 20px;
	}
	h1 {
    	font-size: 20px;
	}
	.sectionWrapFlip a h3{
		font-size:12px;
		margin: 7px 0;
	}
	.flipContentWrap{
		padding-top:10px;
	}
    .slideBtn{
        top:25px;
        right: 30px;
		width: 25px !important;
    	height: 25px;
    }
	.slideBtn .label{
		display: none !important;
	}
	.flipBtnWrap{
		width:24px;
		height:24px;
		top:30px;
		right:16px;
        background:url(../images/contact_white.png) no-repeat;
        background-size:75%;
        background-position:center;
        cursor:pointer;
        background-color:#e21938;
	}
    .flipBlock .back .anchorFlip{
        position: absolute;
        right: 25px;
        top: 40px;
    }
	.unflip-btnWrap{
		/*background:url(../images/closeFlipRevised.jpg) no-repeat;*/
		background:url(../images/closeFlipRevised.jpg) no-repeat;
		background-size:100%;
		background-position:center;

	}
	.footerRight {
		clear: both;
		margin-left: 0;
		margin-top: 10px;
	}
	.homeLink a, .interior .homeLink a, .sectionWrapOne .homeLink a{
		margin-right:17px;
	}
	#leftcolumn{
		width:98px;
	}
	.innertube{
		width:178px;
	}
	.innertube span{
		font-size:10px;
	}
	#contentcolumn {
    	margin-left: 128px;
	}
	.spanWrap {
    	padding-top: 20px;
	}
	.leftWrapper {
    	margin-right: 0;
	}
	.interiorRight {
    	width: 93%;
		margin-top: 50px;
	}
	.newsBlock{
		padding: 20px 15px;
	}
	 h4{
		font-size:14px;
	}
	#program-overview .contacts span, .links span, .contacts span, .links span{
		font-size: 13px;
	}
	.inlineTextBlock {
    	margin-right: 20px;
		margin-top: 10px;
    	margin-bottom: 10px;
	}
	.backClose{
		background: url(../images/close_sml.png) no-repeat;
		width: 30px;
    	height: 30px;
		position: absolute;
		right: 25px;
    	top: 52px;
		z-index: 500;
	}
	a.backBtn.backClose.searchBackButton {
    	/*top: 15px;*/
	    right: 0;
	}
	.mobileAccordion{
		display:block;
		clear:both;
	}
	.interiorNavWrap{
		display:none;
	}
	/*h1.pageTitle{
		margin-top:0;
	}*/
	.interiorPage .subHead{
		margin-top: 20px;
	}
	.resourcesWrap {
    	padding: 0px 15px;
	}
	/*.interiorLeft{
		border-top:0;
	}*/
	h1.pageTitle{
		margin-bottom:0;
		max-width: 60%;
	}
	h2.heading{
		margin-top:0;
		padding-right:28px;
		float: left;
		padding-top: 10px;
		width:100%;
	}
	.sectionWrapFlip{
		min-height: 600px;
		height:auto;
		/*width:100%;*/
	}
	p.bestPractice {
    	font-size: 16px;
	}
	.front{
		min-height: 300px;
    	/*overflow: hidden;*/
    	position: relative !important;
	}
	.flipBlock{
		min-height:0;
		height: auto;
	}
	.sectionWrapFlip, .back {
    	height: 100% !important;
		top:0;
	}
	table{
		width:100%;
		max-width:100%;
	}
	.carSliders{
		top:150px;
	}
	.mobileTable{
		font-size:6px;
		max-width:80%;
	}
	#talltable.mobileTable{
		max-width:100%;
	}
	
	.mobileTable tr,
	.mobileTable tr td,
	.mobileTable td,
	.mobileTable tr th{
		font-size:6px;
	}
	#talltable.mobileTable tr, #talltable.mobileTable tr td, #talltable.mobileTable td, #talltable.mobileTable tr th{
		font-size:9px;
	}
	.screenShot{
		width:100%;
	}
	.thumbControllers {
		height: 70px;
		position: relative;
		top: 125px;
	}
	.vid-controls{
		left:0px !important;
	}
	.mobileTable td:nth-child(4), .mobileTable td:nth-child(5){
		padding-left:22px;
	}
	.noBG{
		background:transparent;
		padding-top:40px;	
	}
	.contacts h2{
		font-size: 16px;
	}
	.links h2{
		font-size: 16px;
		-webkit-text-size-adjust:100% 
	}
	
	.contacts, .links, .contact{
		width:100%;
	}
	.contacts h2, .links h2{
	    margin-bottom: 10px;
    	margin-top: 15px;
	}
	.gridBox{
		width:368px;
		display:block;
		margin:0 auto;
	}
	.gridImg{
		height:auto !important;
	}
	.gridImg img{
		height:auto;
		height:auto;
	}
	.redFolderWrap{
		text-align:center;
	}
	.wrapCollapse {
    	width: auto;
	}
	.whiteText{
		color:#000 !important;
	}
	.fLapBtn{
		margin-bottom: 10px;
		font-size:17px;
		float:none;
		padding:0;
		background:transparent;
	}
	.fLapBtn span{
		color:#000;
		font-size:15px;
		font-family:'Audi Type W01';
	}
	.fLapBtn:hover span, .fLapBtn span:hover{
		color:#000;
	}
	.fLapBtn span{
		background: url(../images/linkSingleArrows.png) no-repeat left;
		padding-left: 15px;
		display: block;
		float: left;
		clear: both;
		font-family: "Audi Type W01 Bold";
		font-size: 15px;
	}
	table.serviceHistory thead tr th:first-of-type {
		width: 270px;
	}
}
@media screen and (max-width:645px){.thumbControllers { height: 70px;position: relative;top: 110px;}}
@media screen and (max-width: 600px){
	.contact{
		clear:both;
		display:block;
	}
	.contacts{max-height:5000px !important; height:auto;}
	#program-overview .contact:nth-child(7), .contact:nth-child(9), .contact:nth-child(11){
		margin-top:0;
	}
	
	/*#program-overview .back{
		height:8000px;
	}*/
	/*#program-overview .flipContentWrap{
		height:1050px !important;
	}*/
	
	
}
@media screen and (max-width:545px){.thumbControllers { height: 70px;position: relative;top: 100px;}}
@media screen and (max-width:445px){.thumbControllers { height: 70px;position: relative;top: 90px;}
.vid-description{
		left:90px !important;
	}
	.vid-controls{
		width:100% !important;
		max-width:none !important;
		left:0px !important;
		bottom:35px !important;
	}
}
@media screen and (max-width: 440px){
	h1 {
		font-size: 18px;
	}
	a.backBtn.backClose{
		font-size: 15px;
		padding-left: 18px;
    	background-size: 12px 19px;
	}
	a.backBtn.backClose:hover {
		background-size: 12px 19px;
	}
	span.search-result-title {
		font-size: 16px;
	}
	.results-wrapper {
		margin: 30px 0;
	}
	.searchResultsPage h2.heading{
		font-size: 12px;
	}
}
@media screen and (max-width: 430px){
	table#keepItAudi td, table#keepItAudi th {
		font-size: 10px;
	}
}
@media screen and (max-width: 360px){
	table#keepItAudi td, table#keepItAudi th {
		font-size: 9px;
	}
}
@media screen and (max-width: 330px){
	table#keepItAudi td, table#keepItAudi th {
		font-size: 8px;
	}
}
@media screen and (max-width: 600px){
	.warranty-keys table td, .warranty-keys table th{
		font-size: 11px;
	}
	.warranty-keys-drop{
		max-width: 130px;
	}
	
}
@media screen and (max-width: 560px){
table.serviceHistory thead tr th:first-of-type {
		width: 40%;
	}
}
@media screen and (max-width: 500px){
	.heroText h1 {
    	font-size: 22px;
	}
}
@media screen and (max-width: 430px){
	.warranty-keys table tr td:first-of-type {
		text-align: left;
		padding: 8px 5px;
	}
	.warranty-keys-drop {
		max-width: 125px;
		min-width: 0;
	}
	.warranty-keys-drop{
		padding: 8px 5px;
	}
	.warranty-keys table td, .warranty-keys table th, .warranty-keys-dropbox a {
		font-size: 9px;
	}
	span.selectDefault{
		font-size: 12px;
	}
	.dropArrow {
		width: 14px;
		height: 7px;
		min-width: 14px;
		min-height: 7px;
		max-width: 14px;
		max-height: 7px;
		background: url(../images/keyDropMobile.png) no-repeat;
		margin-left: 5px;
	}
	.keydropActive .dropArrow {
		background-position: 0 -7px;
	}
}
@media screen and (max-width: 382px){
	table.vehicleKeysTable tr td:nth-child(3){
		padding-left:25px;
	}
	table.vehicleKeysTable tr.rowAdjust td{
		padding-left:5px;
	}
}
@media screen and (max-width: 375px){
	table#windowStickerTable p{
		padding-right: 10px;	
	}
	.interiorWrap .leftWrapper .leftPad .interiorLeft ol li:nth-child(2)::before,.interiorWrap .leftWrapper .leftPad .interiorLeft ol li:nth-child(4)::before,.interiorWrap .leftWrapper .leftPad .interiorLeft ol li:nth-child(5)::before,.interiorWrap .leftWrapper .leftPad .interiorLeft ol li:nth-child(6)::before{
		margin-right: 4px;
	}
	.interiorWrap .leftWrapper .leftPad .interiorLeft ol li:nth-child(5),.interiorWrap .leftWrapper .leftPad .interiorLeft ol li:nth-child(6){
		display: inline-flex;	
	}
	.gridBox{
		width: 100%;	
	}
	.leftWrapper .leftPad .interiorLeft p img{
		width: 100%;
	}	
}
@media screen and (max-width: 345px) {
	.homeLink, .sectionWrapOne .homeLink{
		padding-left:20px;
	}
	.carSliders{
		top:95px;
	}
	.thumbControllers { height: 70px;position: relative;top: 80px;}
}
@media screen and (max-width: 905px){
	.leftWrapper .leftPad .interiorLeft p img{
		width: 100%;
	}
}