/*
	Fluid Baseline Grid v1.0.0
	Designed & Built by Josh Hopkins and 40 Horse, http://40horse.com
	Licensed under Unlicense, http://unlicense.org/

	Base stylesheet with CSS normalization, typographic baseline grid and progressive responsiveness
*/

/* HTML5 DECLARATIONS */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
dialog {
	display: block;
}
audio[controls],
canvas,
video {
	display: inline-block;
	*display: inline;
	zoom: 1;
}

/* IE CONDITIONS*/
.lte9 .banner-slideshow {
	background-image: url(../images/auto-general-building3.jpg);
	background-position: 0px -120px;
}

.lte9 .banner-slideshow2 {
	background-image: url(../images/reception.jpg);
}

.lte9 .our-company {
	background-image: url(../images/auto-general-building2.jpg);
}

.lte9 .our-products {
	background-image: url(../images/products.jpg);
}

.lte9 .our-partners {
	background-image: url(../images/partners.jpg);
}

.lte9 .our-people {
	background-image: url(../images/people.jpg);
}
.lte9 .contact {
	background-image: url(../images/contact.jpg);
}

.lte9 .wrapper-page {
	width: 1200px;
}

.lte9 .wrapper {
	width: 1190px;
	padding-left: 10px;
}

.lte9 .nav-wrapper {
	top: 0;
	float: none;
	text-align: left;
	position: absolute;
	width: 1024px;
	right: 0;
}

.lte9 .intro-text {
	font-weight: lighter;
	font-size: 1.6em;
}

.lte9 .g1,
.g2,
.g3,
.sg1,
.sg2,
.sg3 {
	display: inline;
	float: left;
}
/* 2 COLUMN GRID */
.lte9 .g1 {
	width: 76%;
}
.lte9 .g2 {
	width: 20%;
}
.lte9 .g3 {
	width: 98%;
}
.lte9 .footer {
	background-color: #f1f2f3;
	width: 98%;
}

.lte9 body,
button,
input,
select,
textarea {
	font-size: 1em;
	font-weight: lighter;
	line-height: 1.3em;
}
.lte9 p {
	font-size: 0.9em;
	font-weight: lighter;
	line-height: 1.3em;
}

.lte9 .more-link {
	color: #ffffff;
	padding-left: 18px;
}

.lte9 .banner-text-our-company a:hover,
.lte9 .banner-text a:hover,
.lte9 .banner-text2 a:hover {
	color: #ffffff;
}

.lte9 .linkedin {
	color: #333333;
	font-size: 0.8em;
	background-image: url(../images/linkedin.png);
	background-repeat: no-repeat;
	padding-left: 30px;
	display: inline;
	line-height: 3em;
	background-position: 0px center;
	text-decoration: none;
	padding-top: 10px;
	padding-bottom: 10px;
}

/* TOP NAV */

.lte9 .nav ul {
	background-color: #fff;
	position: absolute;
	left: 0px;
	top: 40px;
	margin: 0;
	padding: 0;
	padding-left: 0px;
	list-style-type: none;
	z-index: 100;
	height: 0;
	width: 220px;
	overflow: hidden;
}

.lte9 .nav ul > li {
	list-style-type: none;
	font-weight: nornal;
	font-size: 1em;
	line-height: 1.3em;
	margin-left: 0px;
	padding-left: 15px;
}

.lte9 .nav ul > li > a {
	text-decoration: none;
	display: block;
	margin-left: 0px;
	padding-bottom: 4px;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 4px;
	color: #000000;
	line-height: 1.3em;
}

.lte9 .nav > li:hover ul {
	height: 8.6em;
}

.lte9 .nav > li:hover ul.menu-three {
	height: 6em;
}

.lte9 .nav > li:hover ul.menu-two {
	height: 4.8em;
}

.lte9 .top .nav > li > a {
	font-size: 1.05em;
	text-decoration: none;
	text-transform: none;
	font-weight: bold;
	color: #000000;
	text-align: left;
	float: none;
}
.lte9 .active {
	color: #de0614;
	font-weight: bold;
	font-size: 1.05em;
}

.lte9 .top .nav > li > a:hover {
	font-size: 1.05em;
	text-decoration: none;
	text-transform: none;
	font-weight: bold;
	color: #de0614;
	text-align: left;
}

.lte9 .top .nav li a.active {
	font-size: 1.05em;
	text-decoration: none;
	text-transform: none;
	font-weight: bold;
	color: #de0614;
	text-align: left;
}

/* SIDE NAV*/

.lte9 .side-nav ul li > a {
	background-image: url(../images/arrow.png);
	background-repeat: no-repeat;
	background-position: 227px 14px;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 10px;
	font-size: 0.95em;
	font-weight: lighter;
	line-height: 1.3em;
	background-color: #e7e7e7;
	display: block;
	position: relative;
	color: #000;
	margin-top: 5px;
	margin-left: 0px;
	margin-bottom: 5px;
}

.lte9 .side-nav ul li > a:hover {
	font-weight: bold;
}

.lte9 .map-text {
	display: none;
}

.lte9 .phone-email {
	font-weight: bold;
}

.lte8 .map-global {
	height: 600px;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
        src='../images/world-map.png',
        sizingMethod='scale');
}

.lte9 .autogeneral {
	padding-top: 6px;
}

/* IE7 and older can't resize px based text */

/* IE7 and older can't resize px based text */

/* BASE */
html {
	height: 100%;
	font-size: 100%;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
}

/* Force scrollbar in non-IE and Remove iOS text size adjust without disabling user zoom */
body {
	margin: 0;
	min-height: 100%;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	background-color: #ffffff;
}

.wrapper-page {
	width: 100%;
	position: relative;
	margin-right: auto;
	margin-left: auto;
}

.side-column {
	background-color: #f1f2f3;
}

.banner {
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	height: 300px;
	margin-bottom: 40px;
	clear: none;
	margin-top: 0px;
	position: relative;
	margin-left: 0px;
	margin-right: 0px;
}
.banner-slideshow {
	background-repeat: no-repeat;
	height: 380px;
	margin-bottom: 40px;
	clear: none;
	margin-top: 0px;
	position: relative;
	margin-left: 0px;
	margin-right: 0px;
	width: auto;
	background-size: cover;
	background-position: center center;
	min-width: 100%;
}
.banner-slideshow2 {
	background-repeat: no-repeat;
	height: 380px;
	margin-bottom: 40px;
	clear: none;
	margin-top: 0px;
	position: relative;
	margin-left: 0px;
	margin-right: 0px;
	width: auto;
	background-size: cover;
	background-position: center center;
	min-width: 100%;
}

.cycle-slideshow {
	height: 420px;
}

.banner-text,
.banner-text2,
.banner-text-our-company,
.banner-text-our-partners,
.banner-text-our-people {
	background-color: #de0614;
	padding-top: 15px;
	padding-right: 15px;
	padding-bottom: 15px;
	padding-left: 15px;
	color: #ffffff;
	font-size: 1.4em;
	line-height: 1em;
}
.banner-text {
	width: 240px;
	height: auto;
	position: absolute;
	top: 20px;
	left: 20px;
}

.banner-text-our-people {
	width: 290px;
	height: auto;
	position: absolute;
	top: 20px;
	left: 20px;
}

.banner-text2,
.banner-text-our-company {
	width: 240px;
	height: auto;
	position: absolute;
	top: 20px;
	right: 20px;
}

.banner-text-our-partners {
	width: 290px;
	height: auto;
	position: absolute;
	top: 20px;
	right: 20px;
}

.box-text {
	margin-right: 15px;
	margin-bottom: 25px;
	margin-left: 15px;
	margin-top: 25px;
}

.intro-text {
	font-weight: lighter;
	font-size: 1.3em;
	color: #666666;
}

.image-right {
	float: right;
	width: auto;
}

.map {
	position: relative;
	margin-left: 0px;
	margin-right: 0px;
	display: block;
}

.map-text {
	display: block;
}

/* column grid */
.g1,
.g2,
.g3 {
	display: block;
	position: relative;
	margin-left: 1%;
	margin-right: 1%;
}

/* 1 column grid */
.g1,
.g2,
.g3 {
	width: 98%;
}

.contact-details {
	width: 58%;
	float: left;
	margin-right: 2%;
}

.google-map {
	width: 37%;
	float: left;
	text-align: center;
}

.google-map iframe {
	width: 350px;
	height: 330px;
}

.contact-1 {
	width: 27%;
	float: left;
	margin-right: 1%;
}

.contact-2 {
	width: 71%;
	float: left;
	padding-left: 1px;
}

.key-contact {
	width: 100%;
	float: left;
	background-color: #f1f2f3;
	padding-top: 20px;
	margin-bottom: 20px;
	margin-right: 5%;
}

.contact-1 p {
	text-align: center;
	margin-bottom: 0px;
}

.phone-email {
	color: #444;
	font-weight: bold;
}

/* Improve default text rendering, handling of kerning pairs and ligatures */

/* DEFAULT FONT SETTINGS */
/* 16px base font size with 150% (24px) friendly, unitless line height and margin for vertical rhythm */
/* Font-size percentage is based on 16px browser default size */

body,
button,
input,
select,
textarea {
	*font-size: 15px;
	color: #000;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 100%;
	line-height: 1.2em;
} /* IE7 and older can't resize px based text */

p,
blockquote,
q,
pre,
address,
hr,
code,
samp,
dl,
ol,
ul,
form,
table,
fieldset,
menu {
	margin: 0 0 1.5em;
	padding: 0;
}
img {
	margin: 0 0 0.8em;
	padding: 0;
}

/* TYPOGRAPHY */
/* Composed to a scale of 12px, 14px, 16px, 18px, 21px, 24px, 36px, 48px, 60px and 72px */

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	color: #000;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
}
h1 {
	margin: 0;
	font-size: 2.3em;
	line-height: 1.2em;
	margin-bottom: 0.4em;
	font-weight: normal;
	color: #790000;
} /* 60px / 72px */

h2 {
	margin: 0;
	font-size: 2em;
	line-height: 1em;
	margin-bottom: 0.5em;
	color: #790000;
	font-weight: bold;
} /* 48px / 48px */

h3 {
	margin: 0;
	font-size: 1.6em;
	font-weight: bold;
	line-height: 1.3333333333333333333333333333333em;
	margin-bottom: 0.6667em;
} /* 36px / 48px */

h4 {
	margin: 0;
	margin-bottom: 0.5em;
	color: #790000;
	font-size: 1.4em;
	font-weight: bold;
	line-height: 1.2em;
	margin-bottom: 0.5em;
} /* 24px / 24px */

h5 {
	margin: 0;
	font-size: 1em;
	line-height: 1em;
	margin-bottom: 0.5em;
	font-weight: bold;
} /* 21px / 24px */
h6 {
	margin: 0;
	font-size: 0.95em;
	line-height: 1.3333333333333333333333333333333em;
	margin-bottom: 0.2em;
	font-weight: bold;
	color: #790000;
} /* 18px / 24px */
p,
ul,
blockquote,
pre,
td,
th,
label {
	margin: 0;
	font-size: 0.9em;
	line-height: 1.5em;
	margin-bottom: 1em;
} /* 16px / 24px */

small,
p.small {
	margin: 0;
	font-size: 0.75em;
	line-height: 1.7142857142857142857142857142857em;
	margin-bottom: 1.7142857142857142857142857142857em;
} /* 14px / 24px */

.centred {
	text-align: center;
}

/* CODE */
pre {
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
} /* Allow line wrapping of 'pre' */
pre,
code,
kbd,
samp {
	font-size: 1em;
	line-height: 1.5em;
	margin-bottom: 1.5em;
	font-family: Menlo, Consolas, 'DejaVu Sans Mono', Monaco, monospace;
}

/* TABLES */
table {
	border-collapse: collapse;
	border-spacing: 0;
	margin-bottom: 1.5em;
}

th {
	text-align: left;
}
tr,
th,
td {
	padding-right: 1.5em;
	border-bottom: 0 solid #333;
}

/* FORMS */
form {
	margin: 0;
}
fieldset {
	border: 0;
	padding: 0;
}
textarea {
	overflow: auto;
	vertical-align: top;
}
legend {
	*margin-left: -0.75em;
}
button,
input,
select,
textarea {
	vertical-align: baseline;
	*vertical-align: middle;
} /* IE7 and older */
button,
input {
	line-height: normal;
	*overflow: visible;
}
button,
input[type='button'],
input[type='reset'],
input[type='submit'] {
	cursor: pointer;
	-webkit-appearance: button;
}
input[type='checkbox'],
input[type='radio'] {
	box-sizing: border-box;
}
input[type='search'] {
	-webkit-appearance: textfield;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}
input[type='search']::-webkit-search-decoration {
	-webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

/* QUOTES */
blockquote,
q {
	quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
	content: '';
	content: none;
}
blockquote,
q,
cite {
	font-style: italic;
}
blockquote {
	padding-left: 1.5em;
	border-left: 3px solid #ccc;
}
blockquote > p {
	padding: 0;
}

/* LISTS */
ul,
ol {
	list-style-position: inside;
	padding: 0;
}
ul {
	list-style-type: none;
}

.bullets {
	list-style-image: url(../images/square.png);
	list-style-position: outside;
	margin-left: 16px;
	line-height: 1.3em;
}

.bullets li {
	margin-bottom: 10px;
}

li ul,
li ol {
	margin: 0 1.5em;
}
dl dd {
	margin-left: 1.5em;
}
dt {
	font-family: Futura, 'Century Gothic', AppleGothic, sans-serif;
}

/* HYPERLINKS */
a {
	color: #790000;
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
a:focus {
	outline: thin dotted;
}
a:hover,
a:active {
	outline: none;
} /* Better CSS Outline Suppression */

.more-link {
	color: #ffffff;
	font-size: 0.7em;
	background-image: url('../images/more.png');
	background-repeat: no-repeat;
	padding-left: 16px;
	display: inline;
	line-height: 1em;
	background-position: 0px 3px;
	text-decoration: none;
}

/* MEDIA */
figure {
	margin: 0;
}
img,
object,
embed,
video {
	max-width: 100%;
	_width: 100%;
} /* Fluid images */
img {
	border: 0;
	-ms-interpolation-mode: bicubic;
} /* Improve IE's resizing of images */
svg:not(:root) {
	overflow: hidden;
} /* Correct IE9 overflow */

.awards {
	width: 48%;
	float: left;
	margin-left: 1%;
	margin-right: 1%;
}
.awards-logo {
	width: 28%;
	float: left;
	text-align: left;
	margin-left: 2%;
}

.awards-text {
	width: 70%;
	float: left;
	clear: right;
}

.team {
	clear: both;
}

.team-photos {
	width: 30%;
	max-width: 177px;
	float: left;
	margin-right: 20px;
}
.team-photos img {
	height: auto;
}
.team-text {
	width: 68%;
	float: left;
	margin-bottom: 20px;
}

/* ABBREVIATION */
abbr[title],
dfn[title] {
	border-bottom: 1px dotted #333;
	cursor: help;
}

/* MARKED/INSERTED/DELETED AND SELECTED TEXT */
ins,
mark {
	text-decoration: none;
}
mark {
	background: #c47529;
}
ins {
	background: #d49855;
}
del {
	text-decoration: line-through;
}
::-moz-selection {
	background: #666;
	color: #fff;
	text-shadow: none;
} /* selected text */
::selection {
	background: #666;
	color: #fff;
	text-shadow: none;
} /* selected text */

/* OTHERS */
strong,
b,
dt {
	font-weight: bold;
}
dfn {
	font-style: italic;
}
var,
address {
	font-style: normal;
}
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
} /* Position 'sub' and 'sup' without affecting line-height */
sup {
	top: -0.5em;
} /* Move superscripted text up */
sub {
	bottom: -0.25em;
} /* Move subscripted text down */
span.amp {
	font-family: Adobe Caslon Pro, Baskerville, 'Goudy Old Style', 'Palatino', 'Palatino Linotype', 'Book Antiqua',
		Georgia, 'Times New Roman', Times, serif;
	font-style: italic;
	font-size: 110%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
} /* Best available ampersand */

/* MICRO CLEARFIX HACK */
.cf:before,
.cf:after {
	content: '';
	display: table;
} /* For modern browsers */
.cf:after {
	clear: both;
}
.cf {
	zoom: 1;
} /* For IE 6/7 (trigger hasLayout) */

/*MENUS*/

.mobile-only {
	display: none;
}

.wrapper {
	width: 100%;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 22px;
	margin-bottom: 18px;
	padding-left: 0px;
	padding-right: 0px;
	position: relative;
	left: 0px;
	right: 0px;
}

.menu-icon {
	font-family: Helvetica, Arial, sans-serif;
	color: #333333;
	font-size: large;
	margin-top: 10px;
	line-height: 2em;
}

.nav-wrapper {
	top: 8px;
	float: none;
	text-align: left;
	position: absolute;
	width: 80%;
	right: 0px;
}
.nav {
	list-style: none;
	position: relative;
}

.nav:before,
.nav:after {
	display: table;
	line-height: 0;
	content: '';
}

.nav:after {
	clear: both;
}

.nav > li {
	float: left;
	position: relative;
	width: auto;
}

.nav > li > a {
	padding-right: 11px;
	padding-left: 15px;
	margin-right: 2px;
	line-height: 3em;
}

.nav ul {
	background-color: #fff;
	position: absolute;
	margin: 0;
	padding: 0;
	z-index: 100;
	height: 0;
	width: 210px;
	overflow: hidden;
	-webkit-transition: height 0.2s ease-in;
	-moz-transition: height 0.2s ease-in;
	-o-transition: height 0.2s ease-in;
	-ms-transition: height 0.2s ease-in;
	transition: height 0.2s ease-in;
}

.nav ul > li {
	list-style-type: none;
	font-weight: normal;
	font-size: 0.9em;
}

.nav ul > li > a {
	text-decoration: none;
	display: block;
	padding-bottom: 4px;
	padding-left: 15px;
	padding-right: 0px;
	padding-top: 4px;
	color: #000000;
	line-height: 1.2em;
}

.nav ul > li > a:hover {
	color: #de0614;
}

.nav ul > li > a:active {
	color: #de0614;
}

.nav > li:hover ul {
	height: 7em;
}

.nav > li:hover ul.menu-three {
	height: 5.5em;
}

.nav > li:hover ul.menu-two {
	height: 3.8em;
}

.top {
	width: 100%;
	height: auto;
	background: #fff;
	z-index: 1000;
	top: 0px;
	position: relative;
}

.logo img {
	display: inline-block;
}

.top .nav {
	float: right;
	line-height: 3em;
	position: relative;
	top: 0px;
	right: 0px;
	width: auto;
}

.top .nav > li > a {
	font-size: 1em;
	text-decoration: none;
	text-transform: none;
	font-weight: bolder;
	color: #000000;
	text-align: left;
	float: none;
}
.active {
	color: #de0614;
	font-weight: bolder;
	font-size: 0.9em;
}

.top .nav > li > a:hover {
	text-decoration: none;
	text-transform: none;
	font-weight: bolder;
	color: #de0614;
	text-align: left;
}

.top .nav > li > a:active {
	text-decoration: none;
	text-transform: none;
	font-weight: bolder;
	color: #de0614;
	text-align: left;
}
.top .nav li a.active {
	text-decoration: none;
	text-transform: none;
	font-weight: bolder;
	color: #de0614;
	text-align: left;
}

.autogeneral {
	position: absolute;
	top: -25px;
	right: -52px;
	font-size: 0.7em;
	font-weight: bold;
	height: 40px;
	width: 250px;
	line-height: 1.1em;
	text-align: center;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
}
.autogeneral a {
	color: #ffffff;
	background-color: #888888;
	padding-left: 8px;
	padding-right: 8px;
	padding-top: 6px;
	padding-bottom: 5px;
	text-decoration: none;
}

.autogeneral a:hover {
	color: #de0614;
	background-color: #f2f2f2;
}

/*SIDE NAVIGATION*/
.side-nav ul {
	list-style-type: none;
}
.side-nav ul li {
	list-style-type: none;
}
.side-nav {
	position: relative;
	z-index: 200;
}

.side-nav ul li > a {
	width: auto;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 6px;
	font-size: 0.95em;
	line-height: 1.3em;
	background-color: #e7e7e7;
	display: block;
	position: relative;
	color: #000;
	margin-top: 5px;
	margin-bottom: 5px;
}

.side-nav ul li > a:hover {
	color: #000;
	background-color: #f1f2f3;
	font-weight: bolder;
}
.side-nav ul li > a:active {
	background-color: #f1f2f3;
	font-weight: bold;
}
.side-nav ul li a.active-side-nav {
	background-color: #f1f2f3;
	font-weight: bold;
}

.arrow {
	float: right;
	font-weight: 900;
	padding-right: 5px;
	font-size: large;
	color: #cccccc;
	padding-bottom: 2px;
}

/*.arrow::after {
content: "›";
}*/
.arrow::after {
	content: url('../images/chevron.png');
}

.facts {
	font-size: 0.9em;
	font-style: italic;
	border-top-color: #e7e7e7;
	border-bottom-color: #e7e7e7;
	border-top-width: 1px;
	border-bottom-width: 1px;
	padding-top: 10px;
	display: block;
	border-right-width: 0px;
	border-left-width: 0px;
	border-style: solid;
	margin-top: 28px;
	color: #666666;
	margin-bottom: 15px;
}

.facts p {
	margin-bottom: 10px;
}

.intro-text {
	font-weight: lighter;
	font-size: 1.3em;
	color: #666666;
}

/* Mobile Version of Nav*/
.nav-mobile {
	float: right;
	width: 200px;
}

.nav-mobile-btn {
	float: right;
	color: #333333;
	padding-top: 0px;
	padding-right: 5px;
	text-decoration: none;
}

.nav-mobile .nav {
	background: #fff;
}

/*BREADCRUMBS*/
.breadcrumbs {
	margin-bottom: 20px;
	font-size: 0.8em;
	color: #000000;
}
.breadcrumbs a {
	color: #000000;
}

/*FOOTER*/
.footer {
	background-color: #f1f2f3;
	width: 98%;
	margin-top: 10px;
}

.footer-disclaimer {
	width: 70%;
	float: left;
	clear: both;
	text-align: left;
	padding-top: 0px;
	margin: 0px;
}

.footer-disclaimer p {
	line-height: 0.5em;
}

.footer-disclaimer a {
	color: #333333;
	margin-left: 0px;
	padding-left: 0px;
}
.footer-disclaimer a:hover {
	color: #333333;
}

.linkedin-container {
	width: 30%;
	float: right;
	text-align: right;
	clear: none;
}
.linkedin {
	color: #333333;
	font-size: 0.8em;
	background-image: url(../images/linkedin.png);
	background-repeat: no-repeat;
	padding-left: 30px;
	display: inline;
	line-height: 3em;
	background-position: 0px center;
	text-decoration: none;
	padding-top: 10px;
	padding-bottom: 10px;
}

.linkedin-container a {
	color: #333333;
}

.linkedin-container a:hover {
	color: #333333;
}

/* media Queries

FOLDING FLUID GRID
< 767px			- 1-Column Fluid Grid
768px - 1023px	- 2-Column Fluid Grid
> 1024px			- 3-Column Fluid Grid
Change widths as necessary
------------------------------------------- */

/* DESKTOP */

@media only screen and (min-width: 1024px) and (max-width: 1399px) {
	.nav {
		display: block !important;
	}

	.our-company {
		background-image: url(../images/auto-general-building2.jpg);
	}
	.our-products {
		background-image: url(../images/products.jpg);
	}
	.our-partners {
		background-image: url(../images/partners.jpg);
	}
	.our-people {
		background-image: url(../images/people.jpg);
	}
	.contact {
		background-image: url(../images/contact.jpg);
	}

	.banner-slideshow {
		background-image: url(../images/auto-general-building3.jpg);
	}

	.banner-slideshow2 {
		background-image: url(../images/reception.jpg);
	}

	.map-global {
		height: 600px;
		background-size: contain;
		background-repeat: no-repeat;
		background-image: url(../images/world-map.png);
	}

	.wrapper-page {
		width: 85%;
		margin: 0 auto;
		max-width: 1200px;
		position: relative;
	}

	.map-text {
		display: none;
	}

	.logo {
		padding-left: 15px;
	}

	/* COLUMN GRID */
	.g1,
	.g2,
	.g3,
	.sg1,
	.sg2,
	.sg3 {
		display: inline;
		float: left;
	}
	/* 2 COLUMN GRID */
	.g1 {
		width: 76%;
	}
	.g2 {
		width: 20%;
	}
	.g3 {
		width: 98%;
	}
}

/* MOBILE */
@media only screen and (max-width: 320px) {
	.mobile-only {
		display: inherit;
	}

	.nav-wrapper {
		float: none;
		position: static;
		width: 100%;
	}

	.nav {
		list-style: none;
		position: relative;
		float: none;
		width: 100%;
		display: none;
	}

	.nav:before,
	.nav:after {
		display: table;
		line-height: 0;
		content: '';
	}

	.nav:after {
		clear: both;
	}
	.nav > li > a {
		position: relative;
		background-color: #e7e7e7;
		margin-top: 3px;
		margin-bottom: 3px;
		line-height: 2em;
		display: block;
		padding-left: 6px;
	}
	.nav > li {
		display: block;
		position: relative;
		width: 100%;
	}
	.nav > li > a:hover {
		background-color: #f1f2f3;
	}

	.nav ul {
		background-color: transparent;
		position: static;
		height: auto;
		width: auto;
		display: none;
	}

	.nav > li:hover ul {
		height: auto;
	}

	.top {
		position: relative;
		height: auto;
	}

	.top .nav {
		float: none;
	}

	.nav-mobile-btn {
		position: absolute;
		top: 0;
		right: 0;
	}

	.logo img {
		height: 36px;
		width: auto;
	}
	.banner {
		background-color: #ffffff;
		margin-bottom: 40px;
		clear: none;
		position: relative;
		height: auto;
	}
	.banner-slideshow {
		background-color: #de0614;
		margin-bottom: 40px;
		clear: none;
		position: relative;
		height: auto;
	}
	.banner-slideshow2 {
		background-color: #de0614;
		margin-bottom: 40px;
		clear: none;
		position: relative;
		height: auto;
	}
	.banner-text,
	.banner-text2,
	.banner-text-our-company,
	.banner-text-our-partners,
	.banner-text-our-people {
		width: auto;
		margin-left: 0%;
		position: relative;
		top: 0px;
		left: 0px;
		clear: none;
		margin-bottom: 0%;
		margin-top: 0%;
		background-color: #de0614;
		margin-right: 0%;
		background-size: auto auto;
		padding-top: 10px;
		padding-right: 10px;
		padding-bottom: 10px;
		padding-left: 10px;
		color: #ffffff;
		font-size: 1.2em;
		line-height: 1em;
	}

	.banner-text,
	.banner-text2,
	.banner-text-our-company {
		height: 220px;
	}
	.banner-text-our-partners {
		height: 230px;
	}

	.logo {
		padding-left: 5px;
	}

	.wrapper {
		margin-top: 10px;
	}
	.linkedin-container {
		clear: left;
		width: 100%;
		text-align: left;
	}

	.footer-disclaimer {
		width: 98%;
	}

	.image-right {
		float: right;
		width: 98%;
	}
	.map {
		display: none;
	}

	.side-nav ul li > a {
		font-size: 0.8em;
	}

	/* COLUMN GRID */
	.g1,
	.g2,
	.g3,
	.sg1,
	.sg2,
	.sg3 {
		display: inline;
		float: left;
	}
	/* 2 COLUMN GRID */
	.g1 .g2 .g3 {
		width: 98%;
	}

	.key-contact,
	.contact-details,
	.google-map,
	.contact-1,
	.contact-2 {
		width: 100%;
	}

	.contact-details p {
		font-size: 0.75em;
	}

	.cycle-slideshow {
		height: auto;
	}

	.awards {
		width: 98%;
		float: left;
		margin-left: 1%;
		margin-right: 1%;
	}

	.awards-logo {
		width: 33%;
		margin-right: 1%;
		margin-left: 1%;
		float: left;
		text-align: center;
	}

	.awards-logo img {
		width: 65px;
		height: auto;
	}

	.awards-text {
		width: 65%;
		float: left;
	}

	.linkedin {
		font-size: 0.78em;
		clear: both;
	}

	.autogeneral {
		position: relative;
		top: 10px;
		left: 0px;
		width: auto;
		height: auto;
		text-align: left;
		margin-left: 8px;
		margin-bottom: 8px;
	}

	.autogeneral a {
		color: #999999;
		padding: 0px;
		background-color: #ffffff;
	}

	.autogeneral a:hover {
		color: #de0614;
		background-color: #ffffff;
	}

	.team-photos {
		width: 100%;
		clear: both;
	}
	.team-text {
		width: 100%;
		clear: both;
	}

	.google-map iframe {
		width: 100%;
		height: 300px;
	}
	.breadcrumbs {
		display: none;
	}
}

@media only screen and (min-width: 321px) and (max-width: 479px) {
	.mobile-only {
		display: inherit;
	}

	.nav-wrapper {
		float: none;
		position: static;
		width: 100%;
	}

	.nav {
		list-style: none;
		position: relative;
		float: none;
		width: 100%;
		display: none;
	}

	.nav:before,
	.nav:after {
		display: table;
		line-height: 0;
		content: '';
	}

	.nav:after {
		clear: both;
	}

	.nav > li > a {
		position: relative;
		background-color: #e7e7e7;
		margin-top: 3px;
		margin-bottom: 3px;
		line-height: 2em;
		display: block;
		padding-left: 6px;
	}
	.nav > li {
		display: block;
		position: relative;
		width: 100%;
	}
	.nav > li > a:hover {
		background-color: #f1f2f3;
	}

	.nav ul {
		background-color: transparent;
		position: static;
		height: auto;
		width: auto;
		display: none;
	}

	.nav > li:hover ul {
		height: auto;
	}

	.top {
		position: relative;
		height: auto;
	}

	.top .nav {
		float: none;
	}

	.nav-mobile-btn {
		position: absolute;
		top: 0;
		right: 0;
	}

	.logo img {
		height: 42px;
		width: auto;
	}
	.banner {
		background-color: #ffffff;
		margin-bottom: 40px;
		clear: none;
		position: relative;
		height: auto;
	}
	.banner-slideshow {
		background-color: #de0614;
		margin-bottom: 40px;
		clear: none;
		position: relative;
		height: auto;
	}
	.banner-slideshow2 {
		background-color: #de0614;
		margin-bottom: 40px;
		clear: none;
		position: relative;
		height: auto;
	}
	.banner-text,
	.banner-text2,
	.banner-text-our-company,
	.banner-text-our-partners,
	.banner-text-our-people {
		width: auto;
		margin-left: 0%;
		position: relative;
		top: 0px;
		left: 0px;
		clear: none;
		margin-bottom: 0%;
		margin-top: 0%;
		background-color: #de0614;
		margin-right: 0%;
		background-size: auto auto;
		padding-top: 10px;
		padding-right: 10px;
		padding-bottom: 10px;
		padding-left: 10px;
		color: #ffffff;
		font-size: 1.2em;
		line-height: 1em;
	}
	.banner-text,
	.banner-text2,
	.banner-text-our-company,
	.banner-text-our-partners {
		height: 160px;
	}

	.logo {
		padding-left: 5px;
	}

	.wrapper {
		margin-top: 12px;
	}
	.linkedin-container {
		clear: left;
		width: 100%;
		text-align: left;
	}

	.footer-disclaimer {
		width: 98%;
	}

	.linkedin {
		clear: both;
	}

	.image-right {
		float: right;
		width: 98%;
	}
	.map {
		display: none;
	}
	.side-nav ul li > a {
		font-size: 0.85em;
	}

	.autogeneral {
		position: relative;
		top: 10px;
		left: 0px;
		width: auto;
		height: auto;
		text-align: left;
		margin-left: 8px;
		margin-bottom: 8px;
	}

	.autogeneral a {
		color: #999999;
		padding: 0px;
		background-color: #ffffff;
	}

	.autogeneral a:hover {
		color: #de0614;
		background-color: #ffffff;
	}

	.awards {
		width: 98%;
		float: left;
		margin-left: 1%;
		margin-right: 1%;
	}

	/* COLUMN GRID */
	/*.g1,*/
	.g2,
	.g3,
	.sg1,
	.sg2,
	.sg3 {
		display: inline;
		float: left;
	}
	/* 2 COLUMN GRID */
	/*.g1 .g2 .g3 {
	width: 98%
}*/

	/* Content Spacing on Small Screens */
	.g1 /*.g2, .g3*/ {
		display: block;
		margin-left: 10px;
		margin-right: 10px;
		float: none;
		width: auto;
	}

	.key-contact,
	.contact-details,
	.google-map,
	.contact-1,
	.contact-2 {
		width: 100%;
	}

	.google-map iframe {
		width: 100%;
		height: auto;
	}

	.cycle-slideshow {
		height: auto;
	}
	.team-photos {
		width: 100%;
		clear: both;
	}
	.team-text {
		width: 100%;
		clear: both;
	}
	.google-map iframe {
		width: 100%;
		height: 300px;
	}
	.breadcrumbs {
		display: none;
	}
}

/* SMALL TABLET */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	/* Mobile Version of Nav*/

	.mobile-only {
		display: inherit;
	}

	.our-company {
		background-image: url(../images/auto-general-building2.jpg);
	}
	.our-products {
		background-image: url(../images/products.jpg);
	}
	.our-partners {
		background-image: url(../images/partners.jpg);
	}

	.our-people {
		background-image: url(../images/people.jpg);
	}
	.contact {
		background-image: url(../images/contact.jpg);
	}

	.banner-slideshow {
		background-image: url(../images/auto-general-building3.jpg);
	}

	.banner-slideshow2 {
		background-image: url(../images/reception.jpg);
	}

	.nav-wrapper {
		float: none;
		position: static;
		width: 100%;
	}

	.nav {
		list-style: none;
		position: relative;
		background: #fff;
		float: none;
		width: 100%;
		display: none;
	}

	.nav:before,
	.nav:after {
		display: table;
		line-height: 0;
		content: '';
	}

	.nav:after {
		clear: both;
	}

	.nav > li > a {
		position: relative;
		background-color: #e7e7e7;
		margin-top: 3px;
		margin-bottom: 3px;
		line-height: 2em;
		display: block;
		padding-left: 6px;
	}
	.nav > li {
		display: block;
		position: relative;
		width: 100%;
	}
	.nav > li > a:hover {
		background-color: #f1f2f3;
	}

	.nav ul {
		background-color: transparent;
		position: static;
		height: auto;
		width: auto;
		display: none;
	}

	.nav > li:hover ul {
		height: auto;
	}

	.top {
		position: relative;
		height: auto;
	}

	.top .nav {
		float: none;
	}

	.nav-mobile-btn {
		position: absolute;
		top: 0;
		right: 0;
	}

	.logo {
		padding-left: 15px;
	}

	.autogeneral {
		position: relative;
		top: 10px;
		left: 0px;
		width: auto;
		height: auto;
		text-align: left;
		margin-left: 8px;
		margin-bottom: 8px;
	}

	.autogeneral a {
		color: #999999;
		padding: 0px;
		background-color: #ffffff;
	}

	.autogeneral a:hover {
		color: #de0614;
		background-color: #ffffff;
	}

	.linkedin-container {
		clear: left;
		width: 100%;
		text-align: left;
	}

	.linkedin {
		clear: both;
	}

	.footer-disclaimer {
		width: 98%;
	}

	.image-right {
		float: right;
		width: 98%;
	}
	.map {
		display: none;
	}

	.awards {
		width: 98%;
		float: left;
		margin-left: 1%;
		margin-right: 1%;
	}

	.awards-logo {
		width: 18%;
		margin-left: 2%;
	}

	.awards-text {
		width: 80%;
		float: left;
	}

	/* COLUMN GRID */
	.g1,
	.g2,
	.g3,
	.sg1,
	.sg2,
	.sg3 {
		display: inline;
		float: left;
	}
	/* 2 COLUMN GRID */
	.g1 .g2 .g3 {
		width: 98%;
	}

	.key-contact,
	.contact-details,
	.google-map {
		width: 100%;
	}
	.cycle-slideshow {
		height: auto;
	}

	.team-photos {
		width: 100%;
		clear: both;
	}
	.team-text {
		width: 100%;
		clear: both;
	}
	.breadcrumbs {
		display: none;
	}
}

/* TABLET */

@media only screen and (min-width: 768px) and (max-width: 1023px) {
	.our-company {
		background-image: url(../images/auto-general-building2.jpg);
	}
	.our-products {
		background-image: url(../images/products.jpg);
	}
	.our-partners {
		background-image: url(../images/partners.jpg);
	}
	.our-people {
		background-image: url(../images/people.jpg);
	}
	.contact {
		background-image: url(../images/contact.jpg);
	}

	.banner-slideshow {
		background-image: url(../images/auto-general-building3.jpg);
	}

	.banner-slideshow2 {
		background-image: url(../images/reception.jpg);
	}

	.mobile-only {
		display: inherit;
	}

	.nav-wrapper {
		float: none;
		position: static;
		width: 100%;
	}

	.nav {
		list-style: none;
		position: relative;
		background: #fff;
		float: none;
		width: 100%;
		display: none;
	}

	.nav:before,
	.nav:after {
		display: table;
		line-height: 0;
		content: '';
	}

	.nav:after {
		clear: both;
	}

	.nav > li > a {
		position: relative;
		background-color: #e7e7e7;
		margin-top: 3px;
		margin-bottom: 3px;
		line-height: 2em;
		display: block;
		padding-left: 6px;
	}
	.nav > li {
		display: block;
		position: relative;
		width: 100%;
	}
	.nav > li > a:hover {
		background-color: #f1f2f3;
	}

	.nav ul {
		background-color: transparent;
		position: static;
		height: auto;
		width: auto;
		display: none;
	}

	.nav > li:hover ul {
		height: auto;
	}

	.top {
		position: relative;
		height: auto;
	}

	.top .nav {
		float: none;
	}

	.nav-mobile-btn {
		position: absolute;
		top: 0;
		right: 0;
	}

	.logo {
		padding-left: 15px;
	}
	.map {
		display: none;
	}

	.awards {
		width: 98%;
		float: left;
		margin-left: 1%;
		margin-right: 1%;
	}

	.awards-logo {
		width: 18%;
		margin-left: 2%;
	}

	.awards-text {
		width: 80%;
		float: left;
	}

	.autogeneral {
		position: relative;
		top: 10px;
		left: 0px;
		width: auto;
		height: auto;
		text-align: left;
		margin-left: 8px;
		margin-bottom: 8px;
	}

	.autogeneral a {
		color: #999999;
		padding: 0px;
		background-color: #ffffff;
	}

	.autogeneral a:hover {
		color: #de0614;
		background-color: #ffffff;
	}

	/* COLUMN GRID */
	.g1,
	.g2,
	.g3,
	.sg1,
	.sg2,
	.sg3 {
		display: inline;
		float: left;
	}
	/* 2 COLUMN GRID */
	.g1 {
		width: 72%;
	}
	.g2 {
		width: 24%;
	}
	.g3 {
		width: 98%;
	}

	.team-photos {
		width: 100%;
		clear: both;
	}
	.team-text {
		width: 100%;
		clear: both;
	}

	.key-contact,
	.contact-details,
	.google-map {
		width: 100%;
	}
}

/* WIDESCREEN */
/* Increased body size for legibility */

@media only screen and (min-width: 1400px) {
	.nav {
		display: block !important;
	}

	.nav ul {
		width: 250px;
	}
	.top .nav > li > a {
		font-size: 1.1em;
	}

	.nav > li > a {
		padding-right: 15px;
		padding-left: 15px;
	}

	.our-products {
		background-image: url(../images/products.jpg);
	}

	.our-company {
		background-image: url(../images/auto-general-building2.jpg);
	}
	.our-partners {
		background-image: url(../images/partners.jpg);
	}
	.our-people {
		background-image: url(../images/people.jpg);
	}
	.contact {
		background-image: url(../images/contact.jpg);
	}

	.banner-slideshow {
		background-image: url(../images/auto-general-building3.jpg);
	}

	.banner-slideshow2 {
		background-image: url(../images/reception.jpg);
	}
	body {
		font-size: 110%;
		background-position: 0 1.25em;
	}
	.banner-text-our-company {
		width: 320px;
	}
	.banner-text-our-partners {
		width: 400px;
	}
	.banner-text-our-people {
		width: 410px;
	}

	.wrapper-page {
		width: 85%;
		margin: 0 auto;
		max-width: 1200px;
		position: relative;
	}

	.map-global {
		height: 600px;
		background-size: contain;
		background-repeat: no-repeat;
		background-image: url(../images/world-map.png);
	}

	.map-text {
		display: none;
	}

	/* COLUMN GRID */
	.g1,
	.g2,
	.g3,
	.sg1,
	.sg2,
	.sg3 {
		display: inline;
		float: left;
	}
	/* 2 COLUMN GRID */
	.g1 {
		width: 76%;
	}
	.g2 {
		width: 20%;
	}
	.g3 {
		width: 98%;
	}
}