@font-face {
	font-family: 'AppFont';
	src: url('../fonts/font.eot');
	src: local('☺'), url('../fonts/font.woff') format('woff'), url('../fonts/font.ttf') format('truetype'), url('../fonts/font.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


h3, .h3 {
  margin-top: 2em;
  margin-bottom: 1em;
}


p {
    -webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
}

html, .view-container, .view-frame{
    width:100%;
    height:100%;
    overflow:  hidden;
}

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}
::-webkit-scrollbar-thumb {
    background-color: #d0d0d0;
}
::-webkit-scrollbar-track {
    background-color: #ebedee;
    position:absolute;
}

body {
    -webkit-touch-callout: none;                /* prevent callout to copy image, etc when tap to hold */
    -webkit-text-size-adjust: none;             /* prevent webkit from resizing text to fit */
    /*-webkit-user-select: none;   */               /* prevent copy paste, to allow, change 'none' to 'text' */
    font-family:'AppFont','HelveticaNeue-Light', 'HelveticaNeue', Helvetica, Arial, sans-serif;
    font-size:10px;
    height:100%;
    margin:0px;
    padding:0px;
    /* text-transform:uppercase; */
    width:100%;
    height:100%;
    letter-spacing: 0.05em;
    overflow:  hidden;
    color: #7b7b7b;
    text-align: center;
    background-color:#fafafa;
   
   /* IE & old Opera */
	scrollbar-face-color: #d0d0d0;
	scrollbar-shadow-color: #d0d0d0;
	scrollbar-highlight-color:#d0d0d0;
	scrollbar-3dlight-color: #d0d0d0;
	scrollbar-darkshadow-color: #ebedee;
	scrollbar-track-color: #ebedee;
	scrollbar-arrow-color: #ebedee;
}

* {
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
body.ios{
	padding-top:20px;
}

.view-container{
	max-width: 120em;
	position: relative;
	text-align: left;
	display: inline-block;
    height:100%;
}

a {
  color: inherit;
}

a:hover, a:focus {
  color: inherit;
  text-decoration: none;
  /* cursor: pointer; */
}
a:active {
  color: #2a6496;
}

.alertCont{
	position: absolute;
	bottom: 1em;
	left: 1em;
	right: 1em;
}
.alert-warning {
  color: #fff;
  background-color: rgba(0,0,0,0.75);
  border-width: 0;
  border-radius: 10em;
  position: relative;
  padding: 1em;
  margin-bottom: 0.9em;
  text-align: center;
  text-shadow: 0 2px 3px #000;
}
.alert-warning div{
	font-size: 1.4em;
}
.alert-dismissable .close {
  position: absolute;
  top: 0.2em;
  right: 0.4em;
  color: inherit;
  font-size: 2.5em;
}
.alert-warning.ng-enter,
.alert-warning.ng-leave,
.alert-warning.ng-move {
  -webkit-transition: 0.5s linear all;
  -moz-transition: 0.5s linear all;
  -o-transition: 0.5s linear all;
  transition: 0.5s linear all;
}

.alert-warning.ng-enter,
.alert-warning.ng-move {
  opacity: 0;
  /*height: 0;*/
  overflow: hidden;
}

.alert-warning.ng-move.ng-move-active,
.alert-warning.ng-enter.ng-enter-active {
  opacity: 1;
  /*height: 120px;*/
}

.alert-warning.ng-leave {
  opacity: 1;
  overflow: hidden;
}

.alert-warning.ng-leave.ng-leave-active {
  opacity: 0;
  /*height: 0;*/
  padding-top: 0;
  padding-bottom: 0;
}

/* Portrait layout (default) */
.hide{
	display:    none;
}
[ng-cloak].view-container {
  display: none !important;
}

.splash{
    top: 0;
    bottom: 0;
    text-align:	center;
    position: absolute;
    left: 0;
    right: 0;
}
.ios .view-container .splash{
	top:-20px;
}
.splashOuterCont{
    max-width: 46em;
    width:		80%;
    height:		100%;
    display:	inline-block;
    position:   relative;
}
.splashInnerCont{
	position:	absolute;
	width:		100%;
	top:		50%;
    
    
	max-width: 500px;
	margin-top: -100px;
}
.splashLogo{
    background-image: url(../img/appLogo.svg);
    width: 119px;
    height: 90px;
    display: inline-block;
    background-size: cover;
}
.splashDonLogo{
    background-image: url(../img/donLogo.svg);
    width: 100%;
    height: 30px;
    position: absolute;
    bottom: 90px;
}
.loadingDataMsg, .loadingDataPercent{
    text-align:center;
    text-transform: uppercase;
}
.loadingDataPercent{
	/* width: 5em; */
	display: inline-block;
	padding: 0 5px;
}
.loadingDataMsg{
    color: #0083ca;
    font-weight: bold;
    padding: 0 5px;
}

.header {
    width:100%;
    position:relative;
}
.headerLogoCont{
    margin-left: 11.6em;
    height:     6.9em;
    width:      8.1em;
    background-image:        -webkit-gradient(linear, left top, left bottom, from(#dcdddf ), to(rgba(220,221,223,0))); /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #dcdddf, rgba(220,221,223,0)); /* Chrome 10+, Saf5.1+ */
    background-image:    -moz-linear-gradient(top, #dcdddf, rgba(220,221,223,0)); /* FF3.6+ */
    background-image:     -ms-linear-gradient(top, #dcdddf, rgba(220,221,223,0)); /* IE10 */
    background-image:      -o-linear-gradient(top, #dcdddf, rgba(220,221,223,0)); /* Opera 11.10+ */
    background-image:         linear-gradient(top bottom, #dcdddf, rgba(220,221,223,0)); /* W3C */

    position: relative;
}
.headerLogo{
	background-image: url(../img/appLogo.svg);
	position: absolute;
	background-size: cover;
}
.headerTagline{
	background-image: url(../img/tagline.svg);
	position: absolute;
	background-position: center;
	background-repeat: no-repeat;
}
.headerButtonCont{
    border-collapse: collapse;
}
.headerButtonCont div .icon{
	display: inline-block;
}
.headerHomeIcon{
    background-image: url(../img/homeAccent.svg);
}
.headerShortlistIcon{
    background-image: url(../img/shortlistAccent.svg);
}
.headerEmailIcon{
    background-image: url(../img/emailAccent.svg);
}
.headerAboutIcon{
    background-image: url(../img/aboutAccent.svg);
}
.headerContactIcon{
    background-image: url(../img/contactAccent.svg);
}
.headerButtonCont>div{
    display: inline-block;
    border-left: 1px solid #c8c8c8;
    -webkit-box-shadow: inset -1px 1px 1px 0px #fff;
    -moz-box-shadow: inset -1px 1px 1px 0px #fff;
    box-shadow: inset -1px 1px 1px 0px #fff;
    position: relative;
    background-color: #ebedee;
    text-align: center;
}
.headerButtons div a{
	display: block;
	position: absolute;
	top: 0;   bottom: 0;   left: 0;   right: 0;
	z-index: 100;
}
.shortlistCountIcon {
	position: absolute;
	background-color: #0083ca;
	display: block;
	color: #fff;
	font-size: 0.8em;
	width: 2em;
	height: 2em;
	text-align: center;
	padding-top: 0.45em;
	right: .5em;
	z-index: 0;
	overflow:hidden;
	-webkit-transition: 0.25s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
	-moz-transition: 0.25s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
	-o-transition: 0.25s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
	transition: 0.25s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
}
.shortlistCountIcon.ng-hide {
  width: 0em;
  height: 0em;
  padding-top: 0em;
}
.shortlistEngineDesc {
	font-style:italic;
	color: #c8c8c8;
}


/* UI */
.progress {
	height: 0.4em;
	border-radius: 0;
}
.progress-bar{
    background-color: #0083ca;
	
}


/* Filter details */
.filterTable{
    display: table;
    width:100%;
    clear: both;
}
.filterHeadingRow{
	background-color: #ebedee;
	text-transform:uppercase;
}
.filterValueRow div{
	color: #0083ca;
}
.filterValueRow .nullValue{
	color: #c8c8c8 !important;
}
.filterGenuineValue {
	color: inherit !important;
}
.filterHeadingRow, .filterValueRow{
    display: table-row;
    /* height:2.8em; */
    font-weight:400;
}
.filterHeadingRow div, .filterValueRow div{
    display: table-cell;
    vertical-align: middle;
    overflow: hidden;
    padding-left: 1em;
}
.filterNameHeading, .filterNameValue{
    padding-left: 2em;
}
.filterSpecs, .filterParts {
	border: 1px solid #ebedee;
	border-width: 3px 1px 0 1px;
	font-weight: 400;
}
.filterSpecRow, .filterPartsRow {
	display:table-row;
}
.filterSpecHeading, .filterPartsHeading {
	background-color:#ebedee;
	display: table-row;
}
.filterSpecCont, .filterPartsCont{
	display: table-row;
}
.filterSpecHeading div, .filterPartsHeading div{
	text-transform:uppercase;
}
.filterSpecRow div, .filterSpecHeading, .filterPartsRow div, .filterPartsHeading {
	display:table-cell;
	padding: .3em;
	border-bottom: 1px solid #ebedee;
}
.filterAddCont {
	cursor: pointer;
	position: relative;
}
.filterAddIcon {
    background-image: url(../img/addIcon.svg);
}
.filterAddIcon.added {
    background-image: url(../img/removeIcon.svg);
}
.filterNote {
	clear:both;
	/* float:left; */
	margin: .2em 1.7em .8em;
	color: #0083ca;
	font-weight: bold;
	white-space: pre-wrap;
}
.quantityWarning {
	clear:both;
	/* float:left; */
	margin: 0 1.9em 1em;
	font-size: 0.9em;
	display: block;
}


.greyButton{
    filter: grayscale(1);
    -webkit-filter: grayscale(1);
	-moz-filter: grayscale(1);
	-o-filter: grayscale(1);
	-ms-filter: grayscale(1);
    opacity: 0.45;
    cursor: pointer;
}
.greyButton:hover{
    filter: none;
    -webkit-filter: none;
	-moz-filter: none;
	-o-filter: none;
	-ms-filter: none;
    opacity: 1;
}

.submit-button{
	color:#fff !important;
    background-color:#699f11;
    background-image:linear-gradient(top, #699f11 0%, #82bb25  100%);
    background-image:-webkit-linear-gradient(top, #699f11 0%, #82bb25  100%);
    background-image:-ms-linear-gradient(top, #699f11 0%, #82bb25  100%);
    
	background-image: -webkit-gradient(	linear,
										left top,
										left bottom,
										color-stop(0, #699f11),
										color-stop(1, #82bb25 )
										);
	border-style: none;
	border-radius: 10em !important;
	margin-top:1em;
	padding: 0.5em 1.4em;
	position: relative;
	text-shadow: 0 1px #4c7a00;
	box-shadow: 0 1px #4c7a00;
	font-size: 1.3em;
	outline:none;
	cursor: pointer;
}
.submit-button:hover[!disabled], .submit-button:focus[!disabled]{
	color:#fff;
    background-image:linear-gradient(top, #82bb25 0%, #699f11  100%);
    background-image:-webkit-linear-gradient(top, #82bb25 0%, #699f11  100%);
    background-image:-ms-linear-gradient(top, #82bb25 0%, #699f11  100%);
    
	background-image: -webkit-gradient(	linear,
										left top,
										left bottom,
										color-stop(0, #82bb25),
										color-stop(1, #699f11 )
										);
	box-shadow: 0 -1px #4c7a00;
}
.submit-button[disabled]{
	color: #bad391 !important;
	text-shadow: none;
	background-image: none;
    background-color:#82bb25;
}



/* About */
.aboutCont {
	position: absolute;
	top: 3.3em;
	bottom: 0;
	left:0;
	right:0;
	overflow-y:auto;
}
.aboutHomeLink, .aboutAgencyLink{
	text-transform:uppercase;
	color: #c8c8c8;
	font-weight: 400;
}
.aboutHomeLink a, .aboutAgencyLink a{
	text-transform:none;
	color: #0083ca;
}
.aboutUpdateText{
	width: 100%;
	text-align:center;
	text-transform:uppercase;
	color: #c8c8c8;
}
.aboutUpdateCont{
	width: 100%;
	text-align:center;
}
.aboutUpdateButton {
	text-transform:uppercase;
	display: inline-block;
}
.aboutUpdateButton .carat{
    background-image: url(../img/updateShadow.svg);
    display: inline-block;
}

/* Contact */
.contactCont{
	display:table;
}
.contactRow{
	display:table-row;
}
.contactIconCont, .contactInfo{
	display:table-cell;
  vertical-align: middle;
}
.contactIcon{
    background-color: #d2d8db;
}
.contactIcon{
	background-repeat:no-repeat;
	background-position: center;
	text-align: center;
}
.contactIcon div{
	display: inline-block;
}
.contactIconPhone {
	background-image: url(../img/contact.svg);
}
.contactIconEmail {
	background-image: url(../img/email.svg);
}
.contactIconNZ {
	background-image: url(../img/nz.svg);
}
.contactIconTime {
	background-image: url(../img/clock.svg);
}
.contactCont a{
	color:#0082bd;
}

/* Email Overlay */
.form-control{
	margin-top:1em;
	margin-bottom: 1em;
	height: 2.5em;
	padding: 0.5em 0.9em;
	font-size: 1.3em;
	border-radius:0.3em;
}
.form-error{
    display: block;
	
    margin: -1em 1em;
    text-align:left;
    color: #972727;
    position: absolute;
}
/* Shortlist */
.shortlistProdDelete{
  	cursor: pointer;
}
.shortlistClearButton .carat{
    background-image: url(../img/removeShadow.svg);
} 

/* Vehicle Details */
.vehicleDetailsImageCont{
    position: absolute;
	text-align: center;
}
.vehicleDetailsClickArea {
	position:absolute;
	cursor: pointer;
	background-color: red;
	opacity: 0;
}
.vehiclePdfButton{
    position: absolute;
    color: #0083ca;
    cursor: pointer;
}
.vehiclePdfButton:hover{
    color: #0083ca;
}
.vehiclePdfButton .icon{
    background-image: url(../img/pdfGrey.svg);
}
.vehiclePrintButton .icon{
    background-image: url(../img/print.svg);
}


/* Screen transitions */
.view-container {
  position: relative;
}
.allow-animate>.view-frame.ng-enter .pageCont {
  opacity:0;
  top: 10em;
  -webkit-transition-delay: .2s;
  -moz-transition-delay: .2s;
  -o-transition-delay: .2s;
  transition-delay: .2s;
}
.allow-animate>.view-frame.ng-leave-active .pageCont {
  opacity:0;
  -webkit-transition-duration: .2s;
  -moz-transition-duration: .2s;
  -o-transition-duration: .2s;
  transition-duration: .2s;
}

.allow-animate>.view-frame.ng-enter.ng-enter-active .pageCont  {
  opacity:1;
  top: 0;
}
.view-frame .pageCont{
  position: absolute;
  -webkit-transition:0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
  -moz-transition:0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
  -o-transition:0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
  transition:0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
}


/*.allow-animate>.view-frame.ng-enter-active, .allow-animate>.view-frame.ng-leave-active{
	opacity:0;
}

.allow-animate>.view-frame.ng-enter {
	-webkit-transition: 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) top;
	-moz-transition: 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) top;
	-o-transition: 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) top;
	transition: 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) top;
  	top: 20px;
}

.allow-animate>.view-frame.ng-enter-active {
  	top: 0;
}

.allow-animate>.view-frame.ng-enter,
.allow-animate>.view-frame.ng-leave {
  position: absolute;
}
.allow-animate>.view-frame.ng-enter {
  -webkit-animation: 0.5s fade-in;
  -moz-animation: 0.5s fade-in;
  -o-animation: 0.5s fade-in;
  animation: 0.5s fade-in;
  z-index: 100;
}

.allow-animate>.view-frame.ng-leave {
  -webkit-animation: 0.25s fade-out;
  -moz-animation: 0.25s fade-out;
  -o-animation: 0.25s fade-out;
  animation: 0.25s fade-out;
  z-index: 99;
}
@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@-moz-keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@-webkit-keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}
@-moz-keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}
@-webkit-keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}*/