
@font-face {
	font-family: 'DecimaMonoPro-Bold';
	src: url(../../Assets/fonts/toyota/DecimaMonoPro-Bold.ttf);
}

@font-face {
	font-family: 'DecimaMonoProLt-Italic';
	src: url(../../Assets/fonts/toyota/DecimaMonoProLt-Italic.ttf);
}

@font-face {
	font-family: 'DecimaMonoPro-Italic';
	src: url(../../Assets/fonts/toyota/DecimaMonoPro-Italic.ttf);
}

@font-face {
	font-family: 'DecimaMonoPro-BoldItalic';
	src: url(../../Assets/fonts/toyota/DecimaMonoPro-BoldItalic.ttf);
}

@font-face {
	font-family: 'DecimaMonoProLt';
	src: url(../../Assets/fonts/toyota/DecimaMonoProLt.ttf);
}

@font-face {
	font-family: 'DecimaMonoPro';
	src: url(../../Assets/fonts/toyota/DecimaMonoPro.ttf);
}

@font-face {
	font-family: 'ToyotaType-Book';
	src: url(../../Assets/fonts/toyota/ToyotaType-Book.ttf);
}

@font-face {
	font-family: 'ToyotaType-BookIt';
	src: url(../../Assets/fonts/toyota/ToyotaType-BookIt.ttf);
}

@font-face {
	font-family: 'ToyotaType-Light';
	src: url(../../Assets/fonts/toyota/ToyotaType-Light.ttf);
}

@font-face {
	font-family: 'ToyotaType-LightIt';
	src: url(../../Assets/fonts/toyota/ToyotaType-LightIt.ttf);
}

@font-face {
	font-family: 'ToyotaType-RegularIt';
	src: url(../../Assets/fonts/toyota/ToyotaType-RegularIt.ttf);
}

@font-face {
	font-family: 'ToyotaType-Regular';
	src: url(../../Assets/fonts/toyota/ToyotaType-Regular.ttf);
}

@font-face {
	font-family: 'ToyotaType-Semibold';
	src: url(../../Assets/fonts/toyota/ToyotaType-Semibold.ttf);
}

@font-face {
	font-family: 'ToyotaType-SemiboldIt';
	src: url(../../Assets/fonts/toyota/ToyotaType-SemiboldIt.ttf);
}

@font-face {
	font-family: 'OpenSans-Regular';
	src: url(../../Assets/fonts/toyota/OpenSans-Regular.ttf);
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
ol,
ul,
li,
fieldset,
form,
label,
legend,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}

body {
	line-height: 1;
	max-width: 2560px;
	margin-left: auto;
	margin-right: auto;
}

a {
	text-decoration: none;
	color: unset;
}

ol,
ul {
	list-style: none;
}

blockquote,
q {
	quotes: none;
}

	blockquote:before,
	blockquote:after,
	q:before,
	q:after {
		content: '';
		content: none;
	}

table {
	border-collapse: collapse;
	border-spacing: 0;
}


.img--DK {
	display: block;
}

.img--MB {
	display: none;
}

.no-controls {
	display: none;
}

h1 {
	font-size: max(2.8125vw, 1.875rem);
	line-height: max(3.5vw, 2.375rem);
	color: #fff;
	text-transform: uppercase;
	text-align: center;
	font-family: DecimaMonoPro-Bold;
}

h2 {
	font-size: max(2.1875vw, 2.625rem);
	text-transform: uppercase;
	font-family: DecimaMonoPro;
	margin-bottom: 55px;
}

h3 {
	font-size: max(1.25vw, 1.5rem);
	text-transform: uppercase;
	font-family: DecimaMonoPro;
}

h4 {
	font-size: max(1.25vw, 1.5rem);
	margin-bottom: 30px;
	font-family: DecimaMonoPro;
}

h5 {
	font-size: 1.375rem;
	font-family: DecimaMonoPro;
	color: #666666;
}

.header__container {
	width: 100%;
	position: relative;
}

.header__text {
	position: absolute;
	bottom: 27.5%;
	width: 100%;
	display: flex;
	justify-content: center;
}

.header__img {
	width: 100%;
	height: auto;
}


.button {
	width: fit-content;
	padding: 16px 23.5px 15px 23.5px;
	-webkit-transform: skew(-12deg);
	-moz-transform: skew(-12deg);
	-ms-transform: skew(-12deg);
	-o-transform: skew(-12deg);
	transform: skew(-12deg);
	font-size: 0.75rem;
	text-transform: uppercase;
	display: flex;
	justify-content: center;
	align-items: center;
	font-family: DecimaMonoPro-Italic;
}

.button--primary {
	background-color: #ff2200;
	color: #fff;
}

.button--secondary {
	background-color: #fff;
	color: black;
}

.button:hover {
	cursor: pointer;
	text-decoration: underline;
}

.button__img {
	width: 9px;
	height: auto;
	margin-left: 10px;
}

.button a {
	height: fit-content;
	display: flex;
	align-items: center;
	font-family: DecimaMonoPro-Italic;
}

.center-content {
	max-width: 1350px;
	margin-left: auto;
	margin-right: auto;
}

.center-content--margin {
	width: 100%;
}

.center-content--no-margin {
	width: 100%;
}

.banner {
	position: relative;
}

.banner__img {
	width: 100%;
}

.banner__content {
	margin-left: auto;
	margin-right: auto;
	position: absolute;
	width: 100%;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
}

.display--MB {
	display: none;
}

.display--DK {
	display: block;
}

.display--MB-inline {
	display: none;
}

.display--DK-inline {
	display: inline;
}

.display--MB-flex {
	display: none;
}

.display--DK-flex {
	display: flex;
}

.text-container {
	display: flex;
	align-items: center;
	margin-bottom: 46px;
}

	.text-container img {
		margin-right: 10px;
	}

	.text-container h3 {
		font-size: 32px;
		font-family: DecimaMonoPro-BoldItalic;
		color: #000;
		leading-trim: both;
		text-edge: cap;
		font-style: normal;
		font-weight: 400;
		line-height: normal;
		text-transform: uppercase;
	}

@media(max-width:1320px) {
	.center-content--margin {
		width: 90%;
	}
}



@media(max-width:768px) {
	.text-container {
		margin-bottom: 40px;
	}

		.text-container h3 {
			font-size: 20px;
		}
}

@media(max-width:500px) {

	h1 {
		font-size: 8.33vw;
		width: 94.44vw;
		line-height: 9.5vw;
	}

	h2 {
		font-size: 6.66vw;
		line-height: 10vw;
		margin-bottom: 30px;
	}

	h3 {
		text-transform: none;
		font-size: 1rem;
	}

	h4 {
		font-size: 1.125rem;
		margin-bottom: 20px;
	}

	h5 {
		font-size: 0.75rem;
	}

	.img--DK {
		display: none;
	}

	.img--MB {
		display: block;
	}

	.header__text {
		bottom: 20px;
	}

	.display--MB {
		display: block;
	}

	.display--DK {
		display: none;
	}

	.display--DK-inline {
		display: none;
	}

	.display--MB-inline {
		display: inline;
	}

	.display--MB-flex {
		display: flex;
	}

	.display--DK-flex {
		display: none;
	}
}

