/*	Website template
	fonts css
	(C) 2024 ConfidIT
	Schnaarsweg 8
	D-28865 Worpswede
*/


/*	referencing self-hosted web fonts starts										*/

@font-face
{
	font-family								: 'robotoregular';
	src										: url('../fonts/roboto-regular-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-regular-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

@font-face
{
	font-family								: 'robotothin';
	src										: url('../fonts/roboto-thin-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-thin-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

@font-face
{
	font-family								: 'robotothin_italic';
	src										: url('../fonts/roboto-thinitalic-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-thinitalic-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

@font-face
{
	font-family								: 'robotoblack';
	src										: url('../fonts/roboto-black-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-black-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

@font-face
{
	font-family								: 'robotoblack_italic';
	src										: url('../fonts/roboto-blackitalic-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-blackitalic-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

@font-face
{
	font-family								: 'robotobold';
	src										: url('../fonts/roboto-bold-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-bold-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

@font-face
{
	font-family								: 'robotobold_italic';
	src										: url('../fonts/roboto-bolditalic-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-bolditalic-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

@font-face
{
	font-family							: 'robotoitalic';
	src										: url('../fonts/roboto-italic-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-italic-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

@font-face
{
	font-family								: 'robotolight';
	src										: url('../fonts/roboto-light-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-light-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

@font-face
{
	font-family								: 'robotolight_italic';
	src										: url('../fonts/roboto-lightitalic-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-lightitalic-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

@font-face
{
	font-family								: 'robotomedium';
	src										: url('../fonts/roboto-medium-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-medium-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}


@font-face
{
	font-family								: 'robotomedium_italic';
	src										: url('../fonts/roboto-mediumitalic-webfont.woff2') format('woff2'),
											  url('../fonts/roboto-mediumitalic-webfont.woff') format('woff');
	font-weight								: normal;
	font-style								: normal;
}

/*	referencing self-hosted web fonts ends											*/



/*	font size definition starts														*/

.size10
{
	font-size								: 0.625em;
}

.size11
{
	font-size								: 0.688em;
}

.size12
{
	font-size								: 0.75em;
}

.size13
{
	font-size								: 0.813em;
}

.size14
{
	font-size								: 0.875em;
}

.size16
{
	font-size								: 1em;
}

.size18
{
	font-size								: 1.125;
}

.size20
{
	font-size								: 1.25em;
}

.size24
{
	font-size								: 1.5em;
}

.size30
{
	font-size								: 1.875em;
}

.size32
{
	font-size								: 2em;
}

.size36
{
	font-size								: 2.25em;
}

.size48
{
	font-size								: 3em;
}

.size60
{
	font-size								: 3.75em;
}

.size72
{
	font-size								: 4.5em;
}

.size90
{
	font-size								: 5.625em;
}

/*	font size definition ends														*/



/*	font styling starts																*/

h1.caption
{
	font-family								: 'robotolight';
	font-size								: 4em;
	letter-spacing							: 2px;
	text-transform							: uppercase;
}

h2.caption
{
	font-family								: 'robotolight';
	font-size								: 3.4em;
	letter-spacing							: 1px;
}

h3.caption
{
	font-family								: 'robotolight';
	font-size								: 1.9em;
	letter-spacing							: 1px;
	text-transform							: uppercase;
}

p.subcaption, span.subcaption
{
	font-family								: 'robotolight';
	font-size								: 2.8em;
	letter-spacing							: 1px;
	text-transform							: uppercase;
}

p.flattext, span.flattext, ul.flattext
{
	font-family								: 'robotoregular';
	font-size								: 1.45em;
	letter-spacing							: 1px;
	line-height								: 1.5em;
	padding-bottom							: 1.2em;
}

p.actioncall
{
	font-family								: 'robotolight';
	font-size								: 1.4em;
	text-transform							: uppercase;
	margin-top								: 10px;
}

.textimage p
{
	padding-left							: 35px;
	
}

ul.flattext
{
	margin-left								: 1em;
}

.tablabel
{
	padding-right							: 0.5vw;
}

a.textlink
{
	text-decoration							: none;
	display									: inline-block;
	color									: rgb(220,220,220);
	transition								: ease 0.5s;
}

a.textlink::after
{
	content									: '';
	display									: block;
	width									: 0;
	margin-left								: 50%;
	height									: 1px;
	color									: rgb(220,220,220);
	background								: rgb(220,220,220);
	transition								: ease 0.5s;
}

a.textlink:hover::after
{
	width									: 100%;
	margin-left								: 0px;
}

a.textlink:hover
{
	color									: rgb(255,255,255);
}

a.textlink.dark
{
	color									: rgb(120,120,120);
}

a.textlink.dark::after
{
	color									: rgb(20,20,20);
	background								: rgb(20,20,20);
}

a.textlink.dark:hover
{
	color									: rgb(20,20,20);
}

.centered
{
	text-align								: center;
}


/*	normalize browser defaults starts												*/
/*	normalize browser defaults starts												*/
/*	normalize browser defaults starts												*/
/*	normalize browser defaults starts												*/
/*	normalize browser defaults starts												*/