@charset "utf-8";
/* CSS Document */






/* -- HEAVY ITALIC --*/




main section {
	display: inline-block;
	position: relative;
	width: 100%;
	height: auto;
	min-height: 100%;
	text-shadow: 1px 1px rgba(0,0,0,0.8);
	z-index: 1;
	text-align: center;
	background-color: #717073;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-attachment: scroll;
}

main section article {
	position: relative;
	z-index: 10;
	margin: 80px 0 50px 0;
}

main section article h1 {
	margin: 0 auto;
	padding: 0 0 15px 0;
	font-size: 36px;
	font-weight: 600;
	width: 650px;
	max-width: 90%;
	text-transform: uppercase;
}

main section article p {
	margin: 0 auto;
	padding: 0 0 15px 0;
	font-size: 18px;
	line-height: 22px;
	width: 550px;
	max-width: 90%;
}

main section a:link {
	color: #EB7010;
}

main section a:visited {
	color: #EB7010;
}

main section a:hover {
	color: #FFF;
}

main section .background {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-attachment: fixed;
	opacity: 0;
}

main section div.background { z-index: 2; transition: opacity ease 0s 0.5s; }
main section div.background.active { z-index: 4; opacity: 1.0; transition: opacity ease 0.5s 0s; }
main section div.background.previous { z-index: 3; }

main section a.next {
	display: block;
	width: 32px;
	height: 32px;
	position: absolute;
	bottom: 18px;
	left: 50%;
	margin-left: -16px;
	background-image: url(../img/iw-next.png);
	background-size: 32px 32px;
	background-position: center;
	background-repeat: no-repeat;
	z-index: 5;
}


#conversions {
	text-shadow: none;
	color: #000;
	height: 100%;
	font-family: 'Oswald';
}


#conversions li{
	margin-left:0 !important;
}

main section#conversions a.next { display: none; }



#conversions form {
    display: inline-block;
    width: 100%;
    min-height: 800px;
    margin: 0;
    background-color: #CCC;
    position: relative;
    text-align: center;
    overflow-x: inherit;
    padding-bottom: 80px;
}

#conversions #back-button {
	position: absolute;
	top: 13px;
	left: 15px;
	border: solid #000 1px;
	background-color: transparent;
	color: #000;
	text-decoration: none;
	text-transform: uppercase;
	padding: 5px;
	font-size: 10px;
	font-weight: 700;
	opacity: 0;
	z-index: 1;
	transition: opacity ease 0.4s 0s;
}

#conversions .two #back-button,
#conversions .three #back-button,
#conversions .save #back-button,
#conversions .extra #back-button,
#conversions .booking #back-button {
	display: block;
	z-index: 100;
	opacity: 1;
	transition: opacity ease 0.4s 0.8s;
}


#conversions form div {
	z-index: 2;
}

#conversions #backgrounds { display: block; width: 102%; height: 100%; position: absolute; top: 0; left: -1%; background-color: #FC0; z-index: 1; background-image: url(../img/form-02.jpg); background-size: cover; background-attachment: fixed;background-position: bottom center; }
#conversions #backgrounds label:nth-child(1) { content: ''; display: block; width: 33.3%; height: 100%; position: absolute; top: 0; left: 0; background-color: #F90; transition: width 0.4s ease; cursor: pointer; background-image: url(../img/form-01.jpg); background-size: cover; background-attachment: fixed; background-position: bottom left; }
#conversions #backgrounds label:nth-child(2) { content: ''; display: block; width: 33.3%; height: 100%; position: absolute; top: 0; left: 33.3%; background-color: #FC0; transition: width 0.4s ease, left 0.4s ease; cursor: pointer; background-image: url(../img/form-02.jpg); background-size: cover; background-attachment: fixed; background-position: bottom center; }
#conversions #backgrounds label:nth-child(3) { content: ''; display: block; width: 33.3%; height: 100%; position: absolute; top: 0; right: 0; background-color: #690; transition: width 0.4s ease; cursor: pointer; background-image: url(../img/form-03.jpg); background-size: cover; background-attachment: fixed; background-position: bottom right; }




#conversions #backgrounds div { width: 100%; height: 54px; background-color: rgba(255,255,255,0.4); position: absolute; top: 0; left: 0; }

#conversions .two #backgrounds div,
#conversions .three #backgrounds div,
#conversions .save #backgrounds div,
#conversions .extra #backgrounds div,
#conversions .booking #backgrounds div,
#conversions .success #backgrounds div
 { width: 100%; height: 54px; position: absolute; left: 0; background-color: rgba(255,255,255,0.4); }

#conversions .weekend #backgrounds label:nth-child(1) { width: 100%; }
#conversions .weekend #backgrounds label:nth-child(2) { width: 0; left: 100%; }
#conversions .weekend #backgrounds label:nth-child(3) { width: 0; }

#conversions .nature #backgrounds label:nth-child(1) { width: 0; }
#conversions .nature #backgrounds label:nth-child(2) { width: 100%; left: 0; }
#conversions .nature #backgrounds label:nth-child(3) { width: 0; }

#conversions .social #backgrounds label:nth-child(1) { width: 0; }
#conversions .social #backgrounds label:nth-child(2) { width: 0; left: 0; }
#conversions .social #backgrounds label:nth-child(3) { width: 100%; }

#conversions #header-conversion {
	position: relative;
	text-align: center;
	width: 700%;
	margin-left: 0;
	margin-top: 0px;
	transition: margin-left 0.4s 0.4s ease, background-color ease 0.4s 0.4s;
	background-color: rgba(255,255,255,0.4);;
}

#conversions #header-conversion:after { content: ''; clear: both; display: block; }


#conversions .two #header-conversion { margin-left: -100%; background-color: rgba(255,255,255,0.4); }
#conversions .three #header-conversion { margin-left: -200%; background-color: rgba(255,255,255,0.4); }
#conversions .save #header-conversion { margin-left: -300%; background-color: rgba(255,255,255,0.4); }
#conversions .extra #header-conversion { margin-left: -400%; background-color: rgba(255,255,255,0.4); }
#conversions .booking #header-conversion { margin-left: -500%; background-color: rgba(255,255,255,0.4); }
#conversions .success #header-conversion { margin-left: -600%; background-color: rgba(255,255,255,0.4); }

#conversions #step-one {
	display: block;
	position: relative;
	width: 300%;
	margin-left: 0;
	padding-bottom: 0px;
	transition: padding-bottom ease 0.4s;
}

#conversions #step-one #options { width: 100%; height: 100%; transition: margin-left 0.4s ease, width 0.4s ease; }
#conversions #step-one #options:after { content: ''; clear: both; display: block; }
#conversions .nature #step-one #options { margin-left: -33.3% !important; }
#conversions .social #step-one #options { margin-left: -66.6% !important; }



#conversions #step-one input[type=radio] {
	display: none;
}

#conversions #step-one label {
	display: block;
	width: 11.1%;
	float: left;
	cursor: pointer;
	margin: 0 0;
	transition: margin ease 0.4s;
}

#conversions #step-one label img {
	width: 75px;
	margin-top: 15px;
}

#conversions .two #step-one label {
	margin: 0 11.1%;
	cursor: default;
}

#conversions .three #step-one label,
#conversions .save #step-one label,
#conversions .extra #step-one label,
#conversions .booking #step-one label,
#conversions .success #step-one label {
	width: 33.3%;
	margin: 0 0;
	transition: none;
	cursor: default;
}

#conversions #step-one label span.headline {
	display: block;
	text-transform: uppercase;
	padding: 15px;
	font-size: 24px;
	font-weight: 700;
	position: relative;
	transition: bottom ease 0.4s 0.4s;
}

#conversions #step-one label span.headline:after {
	content: '';
	display: inline-block;
	width: 0px;
	font-size: 14px;
	overflow: hidden;
	transition: width 0.2s ease;
}

#conversions .lwb #step-one label span.headline:after { content: ' (VW LWB)'; width: 65px; }
#conversions .swb #step-one label span.headline:after { content: ' (VW SWB)'; width: 65px; }
#conversions .hwb #step-one label span.headline:after { content: ' (Hyundai)'; width: 65px; }

#conversions #step-one span.copy {
	display: block;
	overflow: hidden;
	padding: 0 15px;
	margin-top: 15px;
	max-height: 1000px;
	opacity: 1;
	transition:	opacity ease 0.4s, max-height ease 0.4s, padding ease 0s 0.4s;
}

span.copy .content{
	background-color: rgba(255,255,255,.5);
	padding: 10px;
	display: block;
	min-height: 170px;
}

#conversions .two #step-one span.copy,
#conversions .three #step-one span.copy,
#conversions .save #step-one span.copy,
#conversions .extra #step-one span.copy,
#conversions .booking #step-one span.copy,
#conversions .success #step-one span.copy
 { max-height: 0px; opacity: 0; padding: 0 0; }

#conversions .two #step-one, #conversions .two #step-one #options, #conversions .two #step-one #options label,
#conversions .three #step-one, #conversions .three #step-one #options, #conversions .three #step-one #options label,
#conversions .save #step-one, #conversions .save #step-one #options, #conversions .save #step-one #options label,
#conversions .extra #step-one, #conversions .extra #step-one #options, #conversions .extra #step-one #options label,
#conversions .booking #step-one, #conversions .booking #step-one #options, #conversions .booking #step-one #options label,
#conversions .success #step-one, #conversions .success #step-one #options, #conversions .success #step-one #options label
 {
	height: auto;
}

#conversions #step-two {
	position: relative;
	float: left;
	width: 102%;
	height: 0;
	overflow: hidden;
	margin-left: 102%;
	padding-bottom: 0px;
	transition: margin-left ease 0.4s 0.4s;
}

#conversions .two #step-two { height: auto; margin-left: -1%; transition: margin-left ease 0.4s 0.4s; }
#conversions .three #step-two,
#conversions .save #step-two,
#conversions .extra #step-two,
#conversions .booking #step-two,
#conversions .success #step-two
 { height: auto; margin-left: -102%; transition: margin-left ease 0.4s 0s; }

#conversions #step-two label {
	display: inline-block;
	width: 200px;
	text-align: center;
	border: solid #000 1px;
	margin: 10px;
	cursor: pointer;
}

#conversions #step-two label[for=lwb]:after,
#conversions #step-two label[for=swb]:after,
#conversions #step-two label[for=hwb]:after {
	content: '\00a0';
	display: block;
	height: 12px;
	line-height: 12px;
	font-size: 12px;
	margin-bottom: 5px;
}

/*#conversions .nature #step-two label[for=swb]:after,
#conversions .social #step-two label[for=swb]:after,
#conversions .nature #step-two label[for=hwb]:after,
#conversions .social #step-two label[for=hwb]:after {
	content: 'Save $500'
}*/

#conversions #step-two label img {
	width: 198px;
}

#conversions #step-two input[type=radio] {
	display: none;
}

#conversions #step-three {
	position: relative;
	width: 102%;
	height: auto;
	max-height: 0;
	margin-left: 102%;
	padding-bottom: 0px;
	transition: margin-left ease 0.4s 0.4s, max-height 0s 0.4s;
	font-size: 14px;
	line-height: 15px;
	overflow: hidden;
}

#conversions .three #step-three {
	max-height: 8000px;
	margin-left: -1%;
}

#conversions .save #step-three,
#conversions .extra #step-three,
#conversions .booking #step-three,
#conversions .success #step-three {
	max-height: 0;
	margin-left: -102%;
}

#conversions #step-three ul {
	list-style-type: none;
	display: block;
	margin: 0 10%;
	padding: 5px 0;
	text-align: left;
	-webkit-column-count: 3;
	-moz-column-count: 3;
	column-count: 3;
	-webkit-column-gap: 20px;
	-moz-column-gap: 20px;
	column-gap: 20px;
}

#conversions #step-three ul li {
	display: block;
	margin-bottom: 5px;
}

#conversions #step-three ul li div {
	display: inline-block;
}

#conversions #customise {
	font-size: 14px;
	font-weight: 700;
	margin-top: 20px;
}

#conversions #price {
	display: block;
	background-color: rgba(255,255,255,0.4);
	margin: 20px 0;
	padding: 15px 0 10px 0;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
}

#conversions #price span {
	display: block;
	margin: 8px 0 0 0;
	font-size: 28px;
	line-height: 30px;
	text-transform: none;
}

#conversions #price span:before { content: '$'; }
#conversions #price span:after { content: '(inc. GST)'; font-size: 14px; }

#conversions .button {
	font-size: 16px;
	border: 1px solid #000;
	display: inline-block;
	padding: 10px;
	text-transform: uppercase;
	font-weight: 600;
	cursor: pointer;
	background-color: transparent;
	font-family: 'Oswald' !important;
	color:#000;
        margin-top:30px;
}

#conversions #save-cash,
#conversions #extra-features,
#conversions #booking,
#conversions #success {
	position: relative;
	width: 102%;
	height: auto;
	max-height: 0;
	margin-left: 102%;
	padding-bottom: 0px;
	transition: margin-left ease 0.4s 0.4s, max-height 0s 0.4s;
	font-size: 14px;
	line-height: 15px;
	overflow: hidden;
}

#conversions .save #save-cash {
	max-height: 8000px;
	margin-left: -1%;
}

#conversions .extra #extra-features {
	max-height: 8000px;
	margin-left: -1%;
}

#conversions .booking #booking {
	max-height: 8000px;
	margin-left: -1%;
}

#conversions .success #success {
	max-height: 8000px;
	margin-left: -1%;
}

#conversions #save-cash ul,
#conversions #extra-features ul {
	list-style-type: none;
	display: block;
	margin: 0 10%;
	padding: 5px 0;
	text-align: left;
	-webkit-column-count: 3;
	-moz-column-count: 3;
	column-count: 3;
	-webkit-column-gap: 20px;
	-moz-column-gap: 20px;
	column-gap: 20px;
}

#conversions #save-cash ul li,
#conversions #extra-features ul li {
	display: block;
}

#conversions #save-cash ul li div,
#conversions #extra-features ul li div {
	display: inline-block;
}

#conversions #booking ul {
	list-style-type: none;
	display: block;
	/*margin: 20px 10%;*/
	padding: 20px;
	text-align: center;
	max-width: 500px;
	margin: 20px auto; 
}

#conversions #booking div,
#conversions #success div {
	width: 80%;
	margin: 0 auto;
}

/*#conversions #booking input[name*=rego] { width: 95px; }
#conversions #booking input[name*=model] { width: 100px; }
#conversions #booking input[name*=year] { width: 50px; }
#conversions #booking input[name*=name] { width: 265px; max-width: 100%; }
#conversions #booking input[name*=email] { width: 265px; max-width: 100%; }
#conversions #booking input[name*=phone] { width: 265px; max-width: 100%; }
#conversions #booking input[name*=suburb] { width: 205px; max-width: 100%; }
#conversions #booking input[name*=state] { width: 50px; }
#conversions #booking input[type*=submit] { margin: 20px 0; }
#conversions #booking label[for=longdistance] { font-weight: 700; }*/


#conversions #booking input[name*=rego] { width: 100%; }
#conversions #booking input[name*=model] { width: 100; }
#conversions #booking input[name*=year] { width: 100; }
#conversions #booking input[name*=name] { width: 100; max-width: 100%; }
#conversions #booking input[name*=email] { width: 100; max-width: 100%; }
#conversions #booking input[name*=phone] { width: 100; max-width: 100%; }
#conversions #booking input[name*=suburb] { width: 100; max-width: 100%; }
#conversions #booking input[name*=state] { width: 100; }
#conversions #booking input[type*=submit] { margin: 20px 0; }
#conversions #booking label[for=longdistance] { font-weight: 700; }



#conversions #save-cash ul li,
#conversions #extra-features ul li {
	display: none;
	margin-bottom: 5px;
	padding-left: 20px;
}

#conversions #save-cash ul li input,
#conversions #extra-features ul li input {
	margin-left: -20px;
}

#conversions .nature #save-cash ul li.snature,
#conversions .weekend #save-cash ul li.sweekend,
#conversions .social #save-cash ul li.ssocial,
#conversions .nature #extra-features ul li.snature,
#conversions .weekend #extra-features ul li.sweekend,
#conversions .social #extra-features ul li.ssocial
{
	display: block;
}

#conversions #step-three ul li.extras {
	display: none;
}

#conversions .removed div {
	text-decoration: line-through;
}

#conversions .social #step-three #fweekend,
#conversions .social #step-three #fnature,
#conversions .weekend #step-three #fsocial,
#conversions .weekend #step-three #fnature,
#conversions .nature #step-three #fsocial,
#conversions .nature #step-three #fweekend
{ display: none; }

#conversions #disclaimer {
	text-align: center;
	position: absolute;
	bottom: 0px;
	left: 0;
	width: 200%;
	padding: 5px 0;
	font-size: 12px;
	background-color: rgba(255,255,255,0.4);
	transition: opacity ease 0.4s 0.8s, left ease 0.4s 0.4s, background-color ease 0.4s 0.4s;
	opacity: 1;
}

#conversions #disclaimer span { display: block; width: 50%; float: left; padding: 0 2%; }

#conversions .two #disclaimer,
#conversions .three #disclaimer {
	background-color: rgba(255,255,255,0.4);
}

#conversions .three #disclaimer { left: -100%; }

#conversions .extra #disclaimer,
#conversions .save #disclaimer,
#conversions .booking #disclaimer,
#conversions .success #disclaimer {
	left: -100%; opacity: 0; background-color: rgba(255,255,255,0.4);
}

#conversions .power.first div:before { content: 'Power\A'; display: block; margin-bottom: 2px; font-weight: 700; white-space: pre; text-transform: uppercase; }
#conversions .comfort.first div:before { content: 'Comfort\A'; display: block; margin-bottom: 2px; font-weight: 700; white-space: pre; text-transform: uppercase; }
#conversions .water.first div:before { content: 'Water\A'; display: block; margin-bottom: 2px; font-weight: 700; white-space: pre; text-transform: uppercase; }
#conversions .safety.first div:before { content: 'Safety\A'; display: block; margin-bottom: 2px; font-weight: 700; white-space: pre; text-transform: uppercase; }

@media ( max-aspect-ratio:1/1 ), ( max-width: 650px ) {

        #conversions .nature #step-one #options { margin-left: 0 !important; }
        #conversions .social #step-one #options { margin-left: 0 !important; }
	#conversions #backgrounds { background-color: #666; overflow: hidden; background-image: none; }
	#conversions #backgrounds label:nth-child(1),
	#conversions #backgrounds label:nth-child(2),
	#conversions #backgrounds label:nth-child(3) { position: absolute; width: 100%; height: 100%; bottom: -100%; top: auto; left: 0; transition: bottom ease 0.4s; background-image: none; }
	#conversions #step-one, .weekend #step-one, .nature #step-one, .social #step-one { width: 100%; }
	#conversions #step-one #options, .weekend #step-one #options, .nature #step-one #options, .social #step-one #options { margin: 0; }
	#conversions #step-one #options label { float: none; width: 100%; margin: 0; overflow: hidden; max-height: 1000px; transition: max-height ease 0.4s; }
	#conversions #step-one #options label[for=weekend] { background-color: #F90; }
	#conversions #step-one #options label[for=nature] { background-color: #FC0; }
	#conversions #step-one #options label[for=social] { background-color: #690; }
	#conversions .weekend #step-one #options label[for=weekend] { max-height: 1000px; }
	#conversions .weekend #step-one #options label[for=nature] { max-height: 0px; }
	#conversions .weekend #step-one #options label[for=social] { max-height: 0px; }
	#conversions .weekend #backgrounds label:nth-child(1) { bottom: 0; }
	#conversions .nature #step-one #options label[for=weekend] { max-height: 0px; }
	#conversions .nature #step-one #options label[for=nature] { max-height: 1000px; }
	#conversions .nature #step-one #options label[for=social] { max-height: 0px; }
	#conversions .nature #backgrounds label:nth-child(2) { bottom: 0; }
	#conversions .social #step-one #options label[for=weekend] { max-height: 0px; }
	#conversions .social #step-one #options label[for=nature] { max-height: 0px; }
	#conversions .social #step-one #options label[for=social] { max-height: 1000px; }
	#conversions .social #backgrounds label:nth-child(3) { bottom: 0; }
	#conversions #step-three ul,
	#conversions #save-cash ul,
	#conversions #extra-features ul
	 { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; text-align: center; }
}

#conversions #errors { display: block; width: 100%; position: absolute; top: 0; left: 0; z-index: 10000; background-color: rgba(0,0,0,0.4); overflow: hidden; height: 0; opacity: 0; transition: opacity ease 0.4s; }
#conversions #errors.error {  height: 100%; cursor: pointer; opacity: 1; }
#conversions #errors ul { display: block; list-style-type: none; width: 90%; height: 90%; position: absolute; top: 5%; left: 5%; background-color: #F60; margin: 0; padding: 0; }
#conversions #errors ul:before { display: block; font-size: 24px; padding: 20px; background-color: rgba(255,255,255,0.4); text-align: center; font-weight: 700; text-transform: uppercase; content: 'The following errors were detected:'; margin: 0 0 20px 0; }
#conversions #errors ul li { display: block; font-size: 16px; padding: 10px; font-weight: 700; text-align: center; }
#conversions #errors ul:after { display: block; font-size: 14px; padding: 20px; background-color: rgba(255,255,255,0.4); text-align: center; font-weight: 700; text-transform: uppercase; content: 'Okay'; margin: 20px auto 0 auto; width: 30px; }


.page-id-30 #av_section_1 .container{
	max-width: 100%;
    padding: 0;
}

.page-id-30 main{
	padding: 0;	
}

.page-id-30 #wrap_all{
	vertical-align: top !important;
}


#conversions #header-conversion span {
	display: block;
	float: left;
	width: 14.2%;
	padding: 20px 2%;
	font-weight: bold;
	font-size: 24px;
	text-transform: uppercase;
}
/*.page-id-30 .container {
    width: 100% !important;
    max-width: 100% !important;
}*/