/* Transport Consultancy Group Nordic AB */


@import url('https://unpkg.com/aos@2.3.1/dist/aos.css');

@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;1,100;1,300;1,400;1,700&display=swap');

/* ==========================================================================
    Generellt
========================================================================== */

*,
*::before,
*::after {
	box-sizing: border-box;
}

@media only screen and (hover:none) {

	*,
	*::before,
	*::after {
		background-attachment: scroll !important;
		background-position: center center;
	}

}

html {
	font-size: 62.5%;
}

.section-block-wrapper::after {
	content: '';
	display: table;
	clear: both;
}

body {
	background-color: #fff;
	background-position: center center;
	font-family: 'Lato', sans-serif;
	/* background: url(/assets/images/t535i-arbor.jpeg); */
	background-attachment: fixed;
}


body.isMobile .body-background {
	background-position: center center;
	background-size: cover;
}

.LayoutPage .section-block,
.SubPage .LayoutPage .section-block {
	padding: 13rem 5rem;
}

.mw-1200 .section-block-wrapper {
	max-width: 120rem;
}
.p-2{
	padding: 2rem;
}
.pb-5 {
	padding-bottom: 5rem;
}

.pt-3 {
	padding-top: 3rem;
}


.pt-0 .section-block,
.pt-0:not(.section-wrapper) {
    padding-top: 0 !important;
}

.pb-0 .section-block,
.pb-0:not(.section-wrapper) {
       padding-bottom: 0 !important;
}

/* Margins */
.mt-0{
	margin-top: 0;
}

.LayoutPage .padding-8rem .section-block,
.SubPage .LayoutPage .padding-8rem .section-block {
	padding: 8rem;
}

.text-center {
	text-align: center;
}


@media only screen and (max-width:1366px) {

	.LayoutPage .section-block,
	.SubPage .LayoutPage .section-block {
		padding: 10rem 3rem;
	}

	.LayoutPage .padding-8rem .section-block,
	.SubPage .LayoutPage .padding-8rem .section-block {
		padding: 8rem 5rem;
	}

}


@media only screen and (max-width:650px) {

	.LayoutPage .section-block,
	.SubPage .LayoutPage .section-block {
		padding: 7rem 3rem;
	}

	.LayoutPage .padding-8rem .section-block,
	.SubPage .LayoutPage .padding-8rem .section-block {
		padding: 5rem 2rem;
	}

	.p-2{
		padding: 2rem !important;
	}

}

.LayoutPage .section-block-wrapper {
	max-width: 120rem;
}

/* Video background */
.fullscreen-bg-video {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	z-index: -100;
}

#bg-video {
	position: absolute;
	top: 50%;
	left: 50%;
	width: auto;
	height: auto;
	min-width: 100%;
	min-height: 100%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}


.width-120 .section-block .section-block-wrapper {
	max-width: 120rem;
}

.width-150 .section-block .section-block-wrapper {
	max-width: 150rem;
}

.width-160 .section-block .section-block-wrapper {
	max-width: 160rem;
}

.display-none {
	display: none;
}

.EditMode .display-none {
	display: block;
}


.full-height .section-block {
	position: relative;
	height: 100vh;
	min-height: 100%;
}

@media only screen and (max-width:830px) {
	.full-height .section-block {
		height: auto;
	}
}


.gray .section-block {
	background: #f1f1f1;
}

.LayoutPage .block-container {
	margin-bottom: -1px;
}


/* ==========================================================================
CTA Button
========================================================================== */

.cta-btn {
	text-transform: uppercase;
	position: fixed;
	bottom: 3rem;
	width: 100%;
	height: auto;
	text-decoration: none !important;
	text-align: center;
	z-index: 10;
}

.cta-btn a {
	height: 40px;
	color: #000 !important;
	background: #3D7BA0;
	font-size: 1.3rem;
	letter-spacing: .02em;
	padding: 2rem;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none !important;
	cursor: pointer !important;
	border-radius: 8px;
	box-shadow: 0px 4px 7px rgba(0, 0, 0, 0.09);
	-webkit-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}




.cta-btn a:hover {
	background: #008A59;
}


@media only screen and (max-width:696px) {
	.cta-btn {
		bottom: 0;
	}

	.cta-btn a {
		display: block;
		height: auto;
		border-radius: 0;
	}
}



/* ==========================================================================
Cookies 
========================================================================== */
.cookies-notis {
	display: none;
}

.cookies-notis {
	z-index: 9;
	position: fixed;
	bottom: 0;
	right: 0;
	background: #00558C;
	text-align: left;
	padding: 3rem;
	max-width: 70rem;
	width: 100%;
	border-radius: 0;
}

.cookies-notis p,
.cookies-notis a {
	color: #fff;
	font-size: 1.4rem;
	padding: 0;
	font-weight: 400;
	max-width: 60rem;
}

.cookies-notis a {
	font-size: 1.5rem;
	color: #fff;
	text-decoration: underline;
	white-space: nowrap;
	text-transform: none;
	font-weight: 300;
}

.cookies-notis a:hover {
	color: #ffffff;
	text-decoration: underline;
}

.cookies-notis #close-cookies {
	position: absolute;
	top: 1rem;
	right: 1rem;
	cursor: pointer;
}

.cookies-notis #close-cookies em {
	font-size: 3rem;
	padding: 1rem;
	color: #fff;
	transition: .25s ease-in-out;
}

.cookies-notis #close-cookies em:hover {
	color: #f5d4b8;
}

@media only screen and (max-width:620px) {
	.cookies-notis {
		padding: 6rem 2rem 2rem;
	}

	.cookies-notis p,
	.cookies-notis a {
		max-width: 35rem;
		margin: 0;
	}
}


/* ==========================================================================
Split Wrapper
========================================================================== */
.section-split .section-block .normaltext-type {
	max-width: none;
}

.section-split .section-block .section-block-wrapper {
	max-width: 160rem;
}

.section-split .section-block .btn:first-child {
	margin-right: 1rem;
}

.split-wrapper.reverse {
	flex-direction: row-reverse;
}

.split-wrapper.center {
	justify-content: center;
}
/* Centrera content */
.split-wrapper .align-center {
    align-self: center;
}
.split-wrapper {
	display: flex;
	flex-wrap: wrap;
	position: relative;
}

.split-wrapper.split-center {
	justify-content: center;
}

.split-content {
	width: 50%;
	padding: 10rem 8rem;
	text-align: left;
	z-index: 2;
}

.split-content.p-0 {
	padding: 0 !important;
}

.split-image.ml--10rem {
	margin-left: -10rem;
}

.split-text {
	align-self: center;
	width: 100%;
}

.split-content.content-white {
	background: #fff;
}

.split-content.content-blue {
	background: #215872;
}

.split-content.content-blue *:not(.btn) {
	color: #fff;
}

.split-content.pr-12 {
	padding: 0 12rem 0 0 !important;
}

.split-image {
	width: 50%;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.split-image.h-60 {
	height: 60rem;
	display: flex;
	justify-content: flex-end;
}


.split-image.contain img {
	object-fit: contain;
}

.split-image.contain.bg-blue {
	padding: 20px;
}

.split-image img {
	position: absolute;
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
	height: 100%;
	min-width: 100%;
	min-height: 100%;
	max-width: none !important;
}


.split-image.img-auto-width {
	box-shadow: none;
	width: auto;
}

.img-contain img {
	object-fit: contain !important;
	min-width: auto !important;
	width: auto !important;
}

.split-wrapper.small-big .split-content {
	width: 40%;
}

.split-wrapper.small-big .split-image {
	width: 60%;
}

.split-wrapper .align-center {
	align-self: center;
}

@supports (object-fit: cover) {

	.split-image img,
	.split-imageblock img {
		position: relative;
		transform: none;
		top: auto;
		left: auto;

		object-fit: cover;
		object-position: center;
		height: 100% !important;
		width: 100% !important;
	}
}

@media only screen and (max-width:1300px) {
	.split-wrapper.small-big .split-content {
		width: 50%;
	}

	.split-wrapper.small-big .split-image {
		width: 50%;
	}

	.split-content {
		padding: 10rem 4rem;
	}
}

@media only screen and (max-width:1080px) {

	.split-image {
		width: 100%;
		order: 1;
	}

	.split-content {
		width: 100%;
		padding: 5rem 3rem;
		order: 0;
		text-align: center;
	}

	.split-content.pr-12 {
		padding: 5rem 3rem !important;
	}

	.split-content.ml--5rem {
		margin-left: 0 !important;
	}
}

@media only screen and (max-width:600px) {
	.split-content {
		padding: 4rem 0 2rem;
		text-align: left;
	}

	.split-content.content-blue {
		padding: 4rem 2rem;
	}
}

@media only screen and (max-width:550px) {
	.split-wrapper.box-shadow {
		box-shadow: none;
	}
}

/* Cards
========================================================================== */
.cards-wrapper {
    display: flex;
    flex-wrap: wrap;
}

/* Bredder */
.cards-wrapper.w-50 .card-item {
    width: calc((100% / 2) - 2rem);
    margin: 1rem;
}

@media only screen and (max-width: 750px) {
    /* Bredder */
    .cards-wrapper.w-50 .card-item {
        width: 100%;
        margin: 1rem 0;
    }
}

@media only screen and (max-width: 480px) {
    /* Paddings */
    .card-item.p-3,
    .card-item .p-3 {
        padding: 2rem;
    }
}

/* Card 1-1 */


@media only screen and (max-width: 380px) {
    .card-1-1 .card-body a {
        display: block;
    }
}

/* ==========================================================================
 Buttons
========================================================================== */

.btn {
	max-width: 50rem;
	width: auto;
	box-sizing: border-box;
	padding: 1.8rem 6rem;
	border-radius: .6rem;
	text-align: center;
	text-transform: none;
	font-weight: 400;
	font-size: 1.5rem;
	letter-spacing: 0.05rem;
	line-height: 1em;
	-webkit-transition: all .4s ease;
	transition: all .4s ease;
	display: inline-block;
}

.btn {
	background: #3D7BA0;
	border: 2px solid #3D7BA0;
	color: #fff;
}

.btn:hover {
	background: transparent;
	border: 2px solid #3D7BA0;
	color: #3D7BA0;
}

.btn-yellow {
	background: #3D7BA0;
	border: 2px solid #3D7BA0;
	color: #000;
}

.btn-yellow:hover {
	background: transparent;
	border: 2px solid #3D7BA0;
	color: #3D7BA0;
}

.btn-filled-white {
	background: white;
	border: 2px solid white;
	color: #000;
}

.btn-outlined-white {
	background: transparent !important;
	border: 2px solid white;
	color: white;
}

.btn-filled-black {
	background: #000;
	border: 2px solid #000;
	color: white;
}

.btn-outlined-black {
	background: transparent !important;
	border: 2px solid #000;
	color: white;
}

.btn-filled-white:hover {
	background: transparent;
	border: 2px solid white;
	color: white;
}

.btn-filled-black:hover {
	background: transparent;
	border: 2px solid #000;
	color: #000;
}

.btn-outlined-white:hover {
	background: white !important;
	border: 2px solid white;
	color: #000;
}

.btn-outlined-black:hover {
	background: #000 !important;
	border: 2px solid #000;
	color: white;
}

.btn-pdf {
	background: transparent;
	border-radius: .5rem;
	color: #215872;
	text-transform: none;
	letter-spacing: 0;
	font-size: 1.6rem;
	margin: .5rem;
	display: block;
	text-align: left;
}

.btn-pdf:hover {
	background: #215872;
	border: 2px solid #215872;
	border-radius: .5rem;
	color: #fff;
}

.btn-pdf:before {
	font-family: 'Font Awesome 5 Pro';
	font-weight: 700;
	content: '\f1c1';
	margin-right: 1rem;
	text-decoration: none;
	display: inline-block;
}

.btn-pdf:after {
	display: none;
}

.btn-wrapper {
	margin-top: 1rem;
}

.btn-link {
	color: #40BD7C;
}

@media only screen and (max-width: 600px) {
	.btn {
		display: block;
		padding: 1.8rem 3rem;
	}
}

/* Länkar och annat
========================================================================== */
.arrow-link {
	-moz-transition: 0.2s ease-in-out;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
	color: inherit;
	font-weight: 500;
	font-size: 1.5rem;
}

.arrow-link:hover {
	color: #A5182D;
}

.arrow-link:after {
	font-family: 'Font Awesome 5 Pro';
	font-weight: 700;
	content: '\f30b';
	margin-left: 1rem;
	text-decoration: none;
	display: inline-block;
}

.pdf:before {
	font-family: 'Font Awesome 5 Pro';
	font-weight: 700;
	content: '\f1c1';
	margin-right: 1rem;
	text-decoration: none;
	display: inline-block;
}


/* Button span
========================================================================== */
.button {
	text-decoration: none;
	display: inline-block;
	font-weight: 400;
}

.button,
.button::before,
.button::after {
	transition: all .3s ease;
}

.button:hover {
	text-decoration: none;
}

.button-circle {
	position: relative;
	margin: auto;
	padding: 1.2rem 3rem;
	transition: all 0.2s ease;
	color: #000;
}


.button-circle::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	border-radius: .6rem;
	background: #3D7BA0;
	opacity: .8;
	width: 5rem;
	height: 5rem;
	transition: all 0.3s ease;
}

.button-span {
	position: relative;
	font-size: 1.6rem;
	font-weight: 300;
	letter-spacing: 0;
	text-transform: none;
	transition: all .3s ease;
}

.button-span::after,
.btn::after {
	content: '\2192';
	margin-left: .5em;
	transition: all .3s ease;
}

.button:hover .button-span::after {
	margin-left: 1em;
	transition: all .3s ease;
}

.button-circle:hover {
	color: #fff;
}

.button-circle:hover::before {
	width: 100%;
	background: #3D7BA0;
	opacity: 1;
}

.button-circle:active {
	transform: scale(0.96);
}


@media only screen and (max-width:550px) {
	.btn {
		display: block;
		margin: 1.5rem 0;
	}
}

/* ==========================================================================
Bakgrunder & farger
========================================================================== */
.LayoutPage .bg-blue .section-block,
.bg-blue:not(.section-wrapper) {
	background: #215972;
}

.primary-color {
	color: #215972;
}

.text-white {
	color: #FFF;
}

.text-blue{
	color: #3D7BA0;
}

/* ==========================================================================
Text och typsnitt
========================================================================== */
p,
li,
td {
	line-height: 1.7;
	font-size: 1.7rem;
	color: #3B3C43;
	font-family: inherit;
	font-weight: 300;
	text-decoration: none;
}

p {
	padding: 0 0 1.2em 0;
}

a {
	font-size: inherit;
	font-family: inherit;
}

p a {
	color: inherit;
}

a:hover {
	text-decoration: underline;
	color: inherit;
}

a.link {
	font-weight: 500;
	color: inherit;
	font-size: 1.5rem;
}

a.link:after {
	font-family: 'Font Awesome 5 Pro';
	font-weight: 700;
	content: '\f30b';
	margin-left: .5em;
	text-decoration: none;
	display: inline-block;
	font-size: inherit;
	color: inherit;
}


h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: inherit;
	font-weight: normal;
	line-height: 1.25;
	font-weight: 400;
	letter-spacing: 0;
	color: #215972;
	text-transform: normal;
}

.bold {
	color: #0063af;
	font-weight: 600;
	padding-bottom: 0;
}

.italic {
	font-style: italic;
}

.color-white {
	color: #fff;
}

.caption {
	font-size: 2rem;
}

h1,
h2,
h3,
.subheading {
	font-size: 4rem;
	padding-bottom: 3rem;
	line-height: 1.3;
	font-weight: 400;
}

.heading {
	font-size: 2rem;
	padding-bottom: 2rem;
	font-weight: 400;
	color: #3D7BA0;
	text-transform: uppercase;
	letter-spacing: .15em;
}

.small-heading {
	font-size: 2rem;
	font-weight: 500;
	padding-bottom: 1rem;
}


.small-type {
	padding-top: 2rem;
	font-size: 1.3rem;
	max-width: 40rem;
}

.small-type a {
	font-weight: 600;
	font-style: italic;
}

.small-type.center {
	margin: 0 auto;
	text-align: center;
}

.ingress {
	font-weight: 400;
	line-height: 1.5;
	padding-bottom: 2rem;
}

.full-width-textblock {
	position: relative;
	top: 0;
	max-width: 130rem;
	width: 100%;
	height: 100%;
	padding: 2rem 5rem;
	margin: 0 auto;
}

.text-wrapper {
	max-width: 80rem;
	width: 100%;
	text-align: left;
}

.text-block-center{
	max-width: 90rem;
	margin: auto;
}


@media only screen and (max-width: 1466px) {

	h1,
	h2,
	h3,
	.subheading {
		font-size: 4rem;
	}

	.heading {
		font-size: 1.6rem;
	}
}

@media only screen and (max-width: 1250px) {

	h1,
	h2,
	h3,
	.subheading {
		font-size: 3.4rem;
	}
}

@media only screen and (max-width: 1024px) {
	.full-width-textblock {
		padding: 0 5rem;
	}

}

@media only screen and (max-width: 768px) {
	.full-width-textblock {
		padding: 0 2rem;
	}

}

@media only screen and (max-width: 450px) {

	h1,
	h2,
	h3,
	.subheading {
		font-size: 2.4rem;
	}

	p,
	li,
	td {
		line-height: 1.6;
		font-size: 1.6rem;
	}
}

/* lilla "abc"-blocket */
.smalltext-type {
	max-width: none;
}

/* stora "ABC"-blocket */
.normaltext-type {
	max-width: 92rem;
	margin: 0 auto;
	text-align: center;
}

.text-columns .section-block .section-block-wrapper {
	max-width: 140rem;
}

.text-columns .section-block .col-block {
	padding: 0 4rem;
}

.text-columns .normaltext-type {
	text-align: left;
}

.text-columns .heading-type {
	max-width: 80rem;
}

.text-columns .heading-type * {
	text-align: left;
}


@media only screen and (max-width:1466px) {
	.text-columns .section-block .section-block-wrapper {
		max-width: 130rem;
	}
}


@media only screen and (max-width:1080px) {
	.text-columns .section-block .col-block {
		width: 100%;
	}
}

@media only screen and (max-width:696px) {
	.text-columns .section-block .col-block {
		padding: 0;
	}
}

ul.bullet-list {
	padding-inline-start: 3rem;
	overflow: visible;
	margin: 0;
	margin-bottom: 2rem;
}

ul.bullet-list li {
	font-family: inherit;
	font-weight: 300;
	line-height: inherit;
	padding-bottom: 1.5rem;
	list-style: none;
}

ul.bullet-list li::before {
	content: "•";
	display: inline-block;
	width: 2rem;
	font-size: 2rem;
	margin-left: -2rem;
	color: inherit;
	font-family: 'Font Awesome 5 Pro';
	font-weight: 700;
}

ul.bullet-list li a {
	color: inherit;
}



ul.check-list {
	padding-inline-start: 3rem;
	overflow: visible !important;
	margin: 0;
	margin-bottom: 2rem;
	padding-inline-start: 5rem;
}

ul.check-list li {
	font-family: inherit;
	font-weight: 300;
	line-height: inherit;
	padding-bottom: 2rem;
	list-style: none;
}

ul.check-list li::before {
	content: '\f00c';
	display: inline-block;
	width: 4rem;
	font-size: 1.2em;
	margin-left: -2em;
	color: inherit;
	font-family: 'Font Awesome 5 Pro';
	font-weight: 700;
}

ul.check-list li a {
	color: inherit;
}

/* Citat Vart team */
.quote {
	font-style: italic;
}

/* ==========================================================================
Header / Navigation
========================================================================== */

.EditMode #top-header {
	display: none;
}

.EditMode header {
	margin-top: 0 !important;
}

/* --- TEMPORARY TOP HEADER ------- */
/*
#top-header {
    background: transparent;
    border-bottom: 0.5px solid rgba(255, 255, 255, 0.4);
	position: fixed;
	padding: 0;
	top: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
    height: 4rem;
    display: flex;
    flex-wrap: wrap;
        -moz-transition: 0.4s ease-in-out;
    -webkit-transition: 0.4s ease-in-out;
    transition: 0.4s ease-in-out;
    flex-direction: row-reverse;
    z-index: 1;
}

#top-header a {
    line-height: 4rem;
	box-sizing: border-box;
	width:auto;
    color: #fff;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    font-size: 1.2rem;
	white-space: nowrap;
    overflow: hidden !important;
	text-overflow: ellipsis;
	max-width:100%;
	text-decoration: none;
	align-items: center;
	justify-content: flex-end;
	text-align: right;
	padding: 0 2rem;
}


#top-header a:hover {
	text-decoration: underline;
}

#top-header .fas {
	margin-right: .8rem;
}

header.scrolled #top-header { height: 0; font-size: 0; z-index: -1; }
header.scrolled #top-header a { font-size: 0; }
*/

/* -------------------- ----------  */

header {
	background-color: #fff;
	box-shadow: none;
	-moz-transition: 0.4s ease-in-out;
	-webkit-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}

.EditMode.WebbEssDIY header {
	position: relative;
	top: 20px !important;
}

header .container {
	max-width: 100%;
}

header .container::after {
	content: '';
	display: table;
	clear: both;
}


header .header-logo {
	width: 70rem;
	padding: .5rem;
	box-sizing: border-box;
	position: absolute;
	left: 0;
	opacity: 1;
	-moz-transition: 0.4s ease-in-out;
	-webkit-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}

header .header-logo a {
	display: flex;
	flex-wrap: wrap;
	text-decoration: none !important;
}

header .header-logo .logo-text {
	width: 75%;
	font-size: 1.7rem;
	line-height: 1.1;
	text-decoration: none;
	font-weight: 600;
	color: #5c9aca;
	text-transform: uppercase;
	align-self: center;
	letter-spacing: .1em;
	padding-top: 1.3rem;
}


header .header-logo .logo-symbol {
	width: 9rem;
	margin-right: 1rem;
}
.header-logo img{
	width: 9rem !important;
}

@media only screen and (max-width: 660px) {

	header .header-logo .logo-text {
		padding-top: 1rem;
	}

	header .header-logo .logo-text span {
		display: block;
	}
}

@media only screen and (max-width: 550px) {
	header .header-logo {
		padding: 1.5rem .5rem;
	}

	header .header-logo .logo-symbol {
		width: 7rem;
		margin-right: .5rem;
	}

	header .header-logo .logo-text {
		font-size: 1.4rem !important;
	}
}

@media only screen and (max-width: 380px) {
	header .header-logo .logo-text {
		font-size: 1.1rem !important;
		display: none;
	}

	header .header-logo {
		padding: .5rem;
	}

	header .header-logo .logo-symbol {
		width: 12rem;
	}
}

/* HEADER SCROLLED  */

header.scrolled {
	box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.09);
}



/* NAVIGATION */
nav.mainmenu {
	text-align: right;
}

/* Gommer Hem-fliken */
nav.mainmenu ul.TemplateMenu>li:first-child {
	display: none;
}

.EditMode nav.mainmenu ul.TemplateMenu>li:first-child {
	display: inline-block;
}

nav.mainmenu a {
	font-family: inherit;
	font-weight: 400;
	font-style: normal;
	font-size: 1.3rem;
	line-height: 7rem;
	color: #444;
	letter-spacing: 0;
	text-transform: none;
	padding: 0 1.8rem;
	margin: 0;
	transition: all 300ms linear;
}


@media only screen and (max-width:1500px) {
	nav.mainmenu a {
		padding: 0 1.5rem
	}
}



nav.mainmenu ul.TemplateMenu>li {
	line-height: auto;
	height: auto;
	cursor: pointer;
}





/* Dropdown menu */
nav.mainmenu ul>li.expandable-li:hover {
	background-color: transparent;
}

nav.mainmenu li:hover,
nav.mainmenu li.active {
	background-color: transparent !important;
}

nav.mainmenu ul>li.expandable-li:hover>a {
	padding-bottom: 0;
}

nav.mainmenu ul>li>ul {
	background: #f7f7f7;
	padding: 0;
	box-sizing: border-box;
	box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.22);
	line-height: normal;
	height: auto;
	min-width: 100%;
	width: auto;
	text-align: left;
	z-index: 10;
}

nav.mainmenu ul>li>ul>li {
	padding: 0 15px;
	background: #f8f8f8;
}

nav.mainmenu ul>li>ul a {
	background: transparent !important;
	text-decoration: none !important;
	white-space: nowrap;
	line-height: 30px;
}



nav.mainmenu ul>li>ul>li>a {
	color: #444 !important;
	text-transform: unset;
	letter-spacing: normal;
	padding: 1rem;
	line-height: 3;
}

nav.mainmenu ul>li>ul>li>ul a {
	color: #444 !important;
}

nav.mainmenu ul>li>ul>li>ul {
	/*     top: -20px; */
	right: 0px;
}

nav.mainmenu ul>li.expandable-li:hover ul {
	background: #e7e7e7;
}

nav.mainmenu ul>li>ul>li:hover a,
nav.mainmenu ul>li>ul>li.active a {
	color: #444 !important;
}


nav.mainmenu ul>li>ul>li.expandable-li:hover>a {
	border-bottom: none;
	padding-bottom: 1rem;
}

.EditMode nav.mainmenu ul>li>ul>li>ul {
	position: absolute;
	left: unset;
	right: 100%;
}

/* Hamburgarmeny */
@media only screen and (min-width: 1231px) {

	.hamburger {
		display: none;
	}

	.expandable:after {
		font-family: 'Font Awesome 5 Pro';
		font-weight: 700;
		content: '\f0d7';
		margin-left: .8rem;
		text-decoration: none;
		display: inline-block;
		font-size: .8em;
		vertical-align: middle;
	}

	nav.mainmenu li:hover a,
	nav.mainmenu li.active a {
		color: #3D7BA0 !important;
	}
}

@media only screen and (max-width: 1230px) {



	/* Hamburger */
	.hamburger {
		position: absolute;
		z-index: 99;
		left: auto;
		right: 2rem;
		top: 1rem;
	}

	.hamburger-inner,
	.hamburger-inner::after,
	.hamburger-inner::before {
		color: #fff;
		background-color: #000;
	}

	.hamburger--menu .hamburger-inner::after {
		content: 'MENY';
		font-size: 1.1rem;
		letter-spacing: .2em;
	}

	.hamburger-inner,
	.hamburger-inner::after,
	.hamburger-inner::before {
		width: 4rem;
	}

	/* Navigation */
	nav.mainmenu {
		text-align: left;
		display: none;
		position: fixed;
		height: 100%;
		left: 0;
		width: 100%;
		max-width: 35rem;
		background-color: #FFF;
		z-index: 15;
		top: 0;
		box-shadow: none;
		overflow-y: scroll;
	}

	nav.mainmenu .Padding {
		margin: 8rem 0 !important;
	}

	nav.mainmenu li {
		text-align: left;
		display: block;
	}

	nav.mainmenu li a {
		margin: unset;
		padding: unset;
		padding-left: 4rem;
		font-size: 1.8rem;
		line-height: 3;
		color: #000 !important;
	}

	nav.mainmenu .header-btn {
		left: 4rem;
		margin-top: 2rem;
	}

	header nav.mainmenu li.header-btn a {
		padding: inherit !important;
		color: #fff !important;
	}

	header nav.mainmenu li.header-btn:hover a {
		color: #000 !important;
	}

	#overlay {
		z-index: 7;
		background-color: rgba(0, 0, 0, 0.4);

	}


	/* Dropdown */
	nav.mainmenu ul>li>ul {
		width: auto !important;
		border: none;
	}

	nav.mainmenu ul>li>ul {
		display: contents !important;
	}

	nav.mainmenu ul>li>ul>li a {
		color: #000 !important;
	}

	nav.mainmenu ul>li>ul>li>a {
		width: auto;
		padding: 0 0 0 6rem;
	}

	nav.mainmenu ul>li.expandable-li:hover>a {
		padding-bottom: 0;
	}

	nav.mainmenu ul.TemplateMenu>li {
		line-height: normal;
		height: auto;
	}

}

/* ==========================================================================
Top Section
========================================================================== */

.top-section {
	background: rgba(0, 0, 0, 0.438);
	overflow: hidden;
	position: relative;
	display: flex;
	align-items: center;
	padding-top: 7rem;
	height: auto;
	min-height: calc(100vh - 8rem);
}

.page-title-wrap {
	background-color: transparent;
	max-width: none;
	text-align: left;
	transform: none;
	position: static;
	padding: 2rem;
	z-index: 3;
}


.page-title-innerwrap {
	max-width: 100rem;
	padding-left: 7rem;
}

.page-title-wrap .btn-wrapper {
	margin-top: 1rem;
}

.page-title-wrap h1,
.page-title-wrap h2 {
	font-family: inherit;
	text-shadow: none;
}


.page-title-wrap .usp-1 {
	font-size: 5rem;
	color: #fff;
	text-transform: none;
	font-weight: 500;
	padding-bottom: 3rem;
}



.page-title-wrap p {
	color: #fff;
	font-weight: 300;
	line-height: 1.8;
	max-width: 70rem;
}

.page-title-wrap .split-image {
	box-shadow: none;
	height: 80vh;
}

@media only screen and (max-width: 1466px) {
	.page-title-innerwrap {
		padding-left: 5rem;
	}


}

@media only screen and (max-width: 1250px) {
	.page-title-innerwrap {
		padding-left: 3rem;
	}

	.page-title-wrap .usp-1 {
		font-size: 4rem;
	}

}

@media only screen and (max-width: 650px) {
	.page-title-innerwrap {
		padding-left: 0;
	}


	.top-section {
		min-height: 100vh;
	}
}

@media only screen and (max-width: 340px) {
	.page-title-wrap .usp-1 {
		font-size: 2rem;
		padding-bottom: 1rem;
	}
}

/* ==========================================================================
Startsida
========================================================================== */




/* Parallax
========================================================================== */
.parallax {
	max-width: 100% !important;
	background-attachment: fixed !important;
	background-position: center center !important;
	background-repeat: no-repeat;
	background-size: cover !important;
}

.isMobile .parallax {
	background-attachment: scroll !important;
	max-width: 100% !important;
	background-size: cover !important;
}

.parallax .section-block {
	height: 60vh;
}

.parallax-1 {
	background: url('/assets/images/tcgnordic-grupp-perrong-2000px.jpg');
	background-position: center center;
}


/* Startsida: Om oss
========================================================================== */

.LayoutPage .about .section-block-wrapper {
	max-width: 175rem;
}

.LayoutPage .about .section-block {
	position: relative;
	z-index: 1;
	background: #f1f1f1;
	overflow: hidden;
}



.LayoutPage .about .section-block:after {
	content: "";
	display: block;
	position: absolute;
	width: 40vw;
	height: 200vh;
	background: #fff;
	left: 0;
	top: -50vh;
	z-index: 0;
}


@media only screen and (max-width:1466px) {
	.LayoutPage .about .section-block-wrapper {
		max-width: 130rem;
	}
}

@media only screen and (max-width:1400px) {
	.about .split-content {
		padding-right: 0;
	}

}

/* Startsida: Grundare berattar
========================================================================== */
.LayoutPage .quotes .section-block {
	position: relative;
	z-index: 1;
	overflow-x: hidden;
}

.quotes {
	overflow: hidden;
}

.quotes .section-block {
	padding: 15rem 0 12rem 0;
	background: #fff;
}

.quotes .section-block-wrapper {
	max-width: none;

}

.quotes .heading-type * {
	text-align: left;
}

.scroll-wrapper {
	max-width: 130rem;
	width: 100%;
	margin: 0 auto;
	padding: 0 5rem;
	overflow-x: visible;
}

.scroll-wrapper .slick-list {
	overflow: visible;
}

.scroll-card {
	width: 50rem;
	vertical-align: top;
	margin: 0 3rem 2rem 0;
	transition: all .3s ease;
	position: relative;
	border-radius: 2px;
	box-shadow: 0 1rem 3rem rgba(0, 0, 0, .1);
}

.scroll-card:last-child {
	margin-right: 0;
}

.scroll-image-wrapper {
	height: 30rem;
	width: 100%;
	overflow: hidden;
}

.scroll-image {
	object-fit: cover;
	width: 100%;
	height: 100% !important;
}

.scroll-card:hover {
	text-decoration: none;
}

.scroll-text-wrapper {
	position: relative;
	padding: 0 2rem 3rem;
}


.scroll-link {
	text-align: center;
	-moz-transition: 0.2s ease-in-out;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
	position: relative;
	display: block;
	text-decoration: none !important;
}


@media only screen and (max-width: 1024px) {

	.scroll-wrapper {
		padding: 0 2rem;
	}

	.scroll-card {
		margin: 0 2rem 2rem 0;
	}

	.scroll-image-wrapper {
		height: 20rem;
	}

}



/* Reviews */
.quote-item {
	display: flex;
	flex-wrap: wrap;
	text-align: left;
	padding: 2rem;
	box-shadow: 0 0 3rem rgb(0 0 0 / 10%);
	background-color: #fff;
}

.quote-content {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin-bottom: 2rem;
	text-align: left;
}


.quote-image {
	width: 12rem;
	height: 12rem;
	margin-right: 2rem;
	border-radius: 50%;
	overflow: hidden;
	margin-bottom: 1rem;
	align-self: center;
}

.quote-image img {
	object-fit: cover;
	height: 100% !important;
	width: 100% !important;
}

.quote-wrapper .quote-image img.farhang {
	object-position: center top !important;
}

.quote-user {
	width: 60%;
	align-self: center;
}

.quote-user .quote-name {
	font-size: 2.4rem;
	line-height: 1.1;
	padding-bottom: 0;
}

.quote-user .quote-title {
	font-size: 1.6rem;
	color: #638CB8;
	padding: 0;
}


.quote-block {
	width: 100%;
	font-size: 1.6rem;
}


.quote-block .quote-text {
	position: relative;
}


@media only screen and (max-width: 1040px) {
	.LayoutPage .stories .section-block {
		padding-top: 5rem;
	}
}


@media only screen and (max-width: 750px) {
	.LayoutPage .stories .section-block {
		padding: 5rem 0 5rem;
	}

	.scroll-text-wrapper {
		padding: 0;
	}

	.scroll-item {
		padding: 3rem 1rem;
	}

	.quote-block .quote-text::before,
	.quote-block .quote-text::after {
		margin: -3rem;
	}

	.quote-block .quote-text::after {
		margin-left: 1rem;
	}
}

@media only screen and (max-width: 600px) {
	.quotes .section-block {
		padding: 8rem 0 12rem 0;
	}
}



@media only screen and (max-width: 530px) {
	.quote-block blockquote {
		margin: 0;
	}

	.quote-block .quote-text::before,
	.quote-block .quote-text::after {
		display: none;
	}

	.quote-block .quote-text {
		font-size: 1.5rem !important;
		-webkit-text-size-adjust: 100%;
	}

	.quote-user {
		width: 100%;
	}

	.quote-user .name {
		font-size: 1.8rem;
		text-align: left;
		padding-bottom: 0;
	}

	.quote-user .company {
		font-size: 1.2rem;
		text-align: left;
	}
}

@media only screen and (max-width: 480px) {
	.quote-user p {
		text-align: left;
	}

}

@media only screen and (max-width: 370px) {
	.quote-image {
		width: 5rem;
		height: 5rem;
	}

	.quote-user .name {
		font-size: 1.5rem;
	}


	.quote-user .title {
		font-size: 1.4rem;
	}

	.quote-user {
		width: 15rem;
	}

}

@media only screen and (max-width: 345px) {
	.quote-user {
		width: 100%;
		text-align: center;
	}

	.quote-user p {
		text-align: center !important;
	}

	.quote-image {
		margin: 1rem auto;
	}
}


/* Slick settings  */

.slick-list.draggable {
	overflow: visible;
}

.slick-prev,
.slick-next {
	top: -7.5rem;
	width: 4rem;
	height: 4rem;
	border: 1px solid #3D7BA0;
	background-color: #3D7BA0;
	border-radius: 2px;
}

.slick-prev:hover,
.slick-next:hover {
	border: 1px solid #3D7BA0;
	background-color: #3D7BA0;
}

.slick-prev:focus,
.slick-next:focus {
	border: 1px solid #3D7BA0;
	background-color: #3D7BA0;
}

.slick-prev.slick-disabled,
.slick-next.slick-disabled {
	opacity: .5;
}

.slick-prev {
	left: auto;
	right: 13rem;
}

.slick-next {
	right: 8rem;
}

.slick-prev:before,
.slick-next:before {
	color: #fff;
	font-family: 'Font Awesome 5 Pro';

}

.slick-prev::before {
	content: '\f104';
}

.slick-next::before {
	content: '\f105';
}

@media only screen and (max-width: 800px) {

	.slick-prev,
	.slick-next {
		top: auto;
		bottom: -7rem;
	}
}

/* Startsida: Kunder tycker om oss
========================================================================== */
.LayoutPage .customers .section-block {
	background-color: #235872;
}

.LayoutPage .customers .text-wrapper * {
	color: #fff;
}

.LayoutPage .customers .quote-item .quote-block {
	min-height: 20rem;
}

.LayoutPage .customers .quote-image {
	border-radius: 0;
}

@media only screen and (max-width: 1150px) {
	.LayoutPage .customers .quote-item .quote-block {
		min-height: 25rem;
	}
}

@media only screen and (max-width: 890px) {
	.LayoutPage .customers .quote-item .quote-block {
		min-height: 30rem;
	}
}

@media only screen and (max-width: 720px) {
	.LayoutPage .customers .quote-item .quote-block {
		min-height: 25rem;
	}
}

@media only screen and (max-width: 375px) {
	.LayoutPage .customers .quote-item .quote-block {
		min-height: 30rem;
	}
}

/* Startsida: Inledning / Om oss
========================================================================== */
.LayoutPage .services .section-block-wrapper {
	max-width: 160rem;
}

.services .section-block {
	position: relative;
	z-index: 1;
}

.services .btn-wrapper {
	text-align: left;
}

.LayoutPage .services .heading-type {
	max-width: 90rem;
	padding-bottom: 3rem;
}

.LayoutPage .services .heading-type * {
	text-align: left;
}

.LayoutPage .services .heading-type p {
	max-width: 60rem;
}

.services-wrapper {
	display: flex;
	flex-wrap: wrap;
}

.services-wrap {
	width: 46%;
	margin: 2%;
	text-align: center;
	transition: 0.2s ease-in-out;
	display: flex;
	flex-wrap: wrap;
	text-decoration: none !important;
}

.services-icon {
	order: 0;
	height: 13rem;
	width: 13rem;
	padding: 2rem;
	box-sizing: border-box;
	box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.03);
	border-radius: 50%;
	background: transparent;
	border: .4rem solid #3D7BA0;
	color: #3D7BA0;
	-moz-transform: scale(0.7);
	-webkit-transform: scale(0.7);
	transform: scale(0.7);
	-moz-transition: 0.2s ease-in-out;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 2rem;

}

.services-wrap:hover .services-icon {
	-moz-transform: scale(0.75);
	-webkit-transform: scale(0.75);
	transform: scale(0.75);
	box-shadow: 0px 2px 30px rgba(0, 0, 0, 0.05);
}

.services-wrap .far,
.services-wrap .fal {
	font-size: 5rem;
	font-weight: 800;
}

.services-text {
	padding-left: 2rem;
	width: 60%;
	box-sizing: border-box;
	order: 0;
	padding-right: 2rem;
}

.services-text * {
	text-align: left;
}

.services-link {
	display: block;
	position: relative;
	width: 100%;
	font-weight: 500;
}

.services-wrap:hover .services-link {
	color: #3D7BA0;
}

@media only screen and (max-width: 1200px) {
	.services-wrap {
		flex-direction: column;
	}

	.services-text {
		width: 100%;
	}
}

@media only screen and (max-width: 980px) {
	.services-wrap {
		width: 100%;
		margin: 0 0 3rem 0;
	}

	.services-text {
		padding-left: 0;
	}
}

@media only screen and (max-width: 768px) {}


/* Erbjudande
========================================================================== */
.LayoutPage .career {
	background: url('/assets/images/tcgnordic-grupp-perrong-2000px.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center bottom;
}

.LayoutPage .career .section-block {
	background-color: rgba(0, 0, 0, 0.432);
}

.career .section-block *:not(.button-circle) {
	color: #fff;
}

.career .normaltext-type {
	max-width: 80rem;
}

@media only screen and (max-width: 600px) {
	.career .section-block *:not(.button-circle) {
		text-align: left;
	}
}

/* ==========================================================================
Undersidor
========================================================================== */

.SubPage .top-section {
	display: none;
}

.SubPage header {
	background: #fff;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.07);
}

.SubPage nav.mainmenu a,
.SubPage nav.mainmenu li:hover a,
.SubPage nav.mainmenu li.active a {
	color: #000;
}


/* Hero with solid background and title
========================================================================== */
.LayoutPage .hero-block .section-block {
	background: #f1f1f1;
	display: flex;
	flex-wrap: wrap;
	margin-top: 7rem;
	padding: 12rem 3rem;
	position: relative;
}

.bg-gray-light {
	background-color: #f1f1f1 !important;
}

.mw-1200

.LayoutPage .hero-block.bg-blue .section-block {
	background: #215972;
}

.LayoutPage .hero-block.bg-blue .section-block * {
	color: #fff;
}

.LayoutPage .hero-block .section-block-wrapper {
	align-self: center;
}

.LayoutPage .hero-block .section-block .col-wrapper {
	align-self: center;
}

.LayoutPage .hero-block .section-block * {
	text-align: center;
}

.LayoutPage .hero-block .heading-type {
	max-width: 100rem;
}

.LayoutPage .hero-block .heading {
	padding-bottom: 0;
}

.LayoutPage .hero-block .page-heading {
	margin: 0 auto;
	padding: 0;
}

.LayoutPage .hero-block p {
	max-width: 80rem;
	margin: 0 auto;
	padding-top: 2rem;
	padding-bottom: 0;
}

.LayoutPage .hero-block a {
	text-decoration: underline;
	font-weight: 600;
}



@media only screen and (max-width: 950px) {
	.hero-block .section-block .subheading {
		font-size: 3.5rem;
	}
}

@media only screen and (max-width: 600px) {

	.LayoutPage .hero-block .section-block * {
		text-align: left;
	}

}




/* Hero with image background or background video
========================================================================== */
.LayoutPage .hero-image {
	background: transparent;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-attachment: fixed;
}

.LayoutPage .hero-image .section-block {
	height: 60vh;
}


/* CTA Section (Generellt) 
========================================================================== */
/* (video background) */
.LayoutPage .cta-section {
	background: transparent;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: center bottom;
}

.LayoutPage .cta-section .section-block {
	background-color: rgba(0, 0, 0, 0.6);
}

.LayoutPage .cta-section .section-block * {
	color: #fff;
}

@media only screen and (max-width: 600px) {
	.LayoutPage .cta-section .section-block *:not(.btn) {
		text-align: left;
	}
}

/* ========================================================================== 
Undersida: Tjanster
========================================================================== */

#dokumentationsledning img {
	object-position: right center;
}

.LayoutPage .services-splits .section-block {
	padding-top: 5rem;
}

.services-splits .normaltext-type {
	margin-bottom: 6rem;
}

.services-splits .normaltext-type:nth-child(even) {
	background: #215872;
}

.services-splits .normaltext-type:nth-child(even) *:not(.heading) {
	color: #fff;
}

.services-splits .normaltext-type:nth-child(even) .split-wrapper {
	flex-direction: row-reverse;
}

@media only screen and (max-width:1500px) {
	.services-splits .split-content {
		padding: 5rem;
	}
}

@media only screen and (max-width:1080px) {
	.services-splits .split-image {
		max-height: 50rem;
	}

	.services-splits .split-content {
		text-align: left;
	}
}

@media only screen and (max-width:650px) {
	.services-splits .subheading {
		font-size: 2rem;
	}

	.services-splits .split-content {
		padding: 5rem 0 0rem;
	}

	.services-splits .normaltext-type:nth-child(even) {
		background: transparent;
	}

	.services-splits .normaltext-type:nth-child(even) *:not(.heading) {
		color: #000;
	}

	.services-splits .normaltext-type {
		margin-bottom: 0;
	}
}

/* ==========================================================================
Undersida: Var verksamhet (TCG Nordic)
========================================================================== */
.value .section-block .section-block-wrapper {
	max-width: 160rem;
}


.value .split-content:first-child {
	background-color: #215972;
	width: 40%;
	padding: 10rem 7rem;
}

.value .split-content:first-child * {
	color: #fff;
}


.value .split-content:last-child {
	width: 60%;
}

.value-content {
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	background-color: #f8f8f8;
}

.value-item {
	padding: 4rem;
	width: 33%;
}

.value-item .value-text {
	align-self: center;
	text-align: center;
}

.value-item em {
	color: #215972;
	font-size: 4rem;
	margin-bottom: 2rem;
}

.value-item p {
	padding-bottom: 0;
}

@media only screen and (max-width: 1320px) {
	.value-item {
		width: 50%;
	}
}

@media only screen and (max-width: 1200px) {
	.value .split-content {
		width: 100%;
	}

	.value .split-content .split-text {
		max-width: 60rem;
	}

	.value-content .services-item {
		padding: 6rem;
	}

	.value .split-content:first-child {
		padding: 8rem 4rem;
	}
}

@media only screen and (max-width: 1070px) {
	.value-item {
		width: 50%;
	}

	.value .split-content:first-child,
	.value .split-content:last-child {
		width: 100%;
	}

	.value .split-content:first-child * {
		text-align: center;
		margin: 0 auto;
	}
}

@media only screen and (max-width: 600px) {
	.value .split-content:first-child * {
		text-align: left;
		margin: 0;
	}

	.value-item .value-text {
		text-align: left;
	}

	.value-item {
		width: 100%;
	}
}


/* ==========================================================================
Undersida: Karriär
========================================================================== */


/* Vardeord for jobbet
========================================================================== */
.work-value .value-content {
	background: transparent;
}

.work-value .value-item {
	width: 23%;
	margin: 1%;
	padding: 7rem 3rem;
	background-color: #f8f8f8;
}

@media only screen and (max-width: 1260px) {
	.work-value .value-item {
		width: 31%;
		padding: 5rem 3rem;
	}
}

@media only screen and (max-width: 940px) {
	.work-value .value-item {
		width: 48%;
		padding: 5rem 3rem;
	}
}

@media only screen and (max-width: 650px) {
	.work-value .value-item {
		width: 100%;
		margin: 0 0 2rem 0;
		padding: 4rem 2rem;
	}
}

/* Galleri
========================================================================== */
.LayoutPage .gallery .section-block-wrapper {
	max-width: none;
}

.LayoutPage .gallery .section-block {
	padding: 2rem;
}


.product-gallery {
	display: flex;
	flex-wrap: wrap;
	position: relative;

}

.product-gallery .project-thumb-wrapper {
	width: 18%;
	margin: 1%;
	box-shadow: none;
	height: 30rem;
}

.product-gallery .project-thumb-wrapper .project-thumb {
	background: transparent;
	padding: 15rem 2rem;
}

.product-gallery .project-thumb-wrapper:hover .project-thumb {
	background-color: rgba(0, 0, 0, 0.29);
}

.product-gallery .project-thumb p {
	font-size: 4rem;
	text-align: center;
}

@media only screen and (max-width:1300px) {
	.product-gallery .project-thumb-wrapper {
		width: 31% !important;
	}
}


@media only screen and (max-width:1000px) {
	.product-gallery .project-thumb-wrapper {
		width: 48% !important;
		height: 30rem !important;
	}
}


@media only screen and (max-width:500px) {
	.product-gallery .project-thumb-wrapper {
		height: 15rem !important;
	}
}


/* ==========================================================================
Undersida: Lediga tjänster
========================================================================== */
.LayoutPage .positions .section-block-wrapper {
	max-width: 150rem;
}

.LayoutPage .positions2 .section-block-wrapper {
	max-width: 100rem;
}

.LayoutPage .positions .subheading {
	max-width: 90rem;
	margin: 0 auto;
}

.position-items-wrapper {
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.position-item {
	position: relative;
	margin: 1%;
	width: 31%;
	background-color: #fff;
	box-shadow: 0 1rem 1.5rem rgba(18, 19, 64, 0.1);
	padding: 8rem 5rem;
	overflow: hidden;
	transition: all .3s ease;
}

.position-item::before {
	content: '';
	display: block;
	width: 100%;
	height: 5px;
	background: #3D7AA0;
	position: absolute;
	bottom: 0;
	left: 0;
}

.position-item:nth-child(even)::before {
	background: #78B9F4;
}

.position-item:hover {
	text-decoration: none;
	transform: translateY(-1rem);
}


.position-item .position-text {
	align-self: center;
	text-align: center;
}

.position-item .position-title {
	font-size: 2rem;
}

.position-item i {
	color: #215972;
	font-size: 4rem;
	margin-bottom: 2rem;
}

.position-item p {
	padding-bottom: 0;
}
.section-service-split-column .col-1,
.section-service-split-column .col-2{
padding: 2rem;
}

@media only screen and (max-width: 1100px) {
	.position-item {
		width: 48%;
	}
}



@media only screen and (max-width: 600px) {

	.position-item .position-text {
		text-align: left;
	}

	.position-item {
		width: 100%;
	}

	.LayoutPage .positions .subheading {
		text-align: left;
	}
}


/* ==========================================================================
Undersida: Referensuppdrag
========================================================================== */
.LayoutPage .cases .section-block-wrapper {
	max-width: 160rem;
}

.LayoutPage .cases .section-block {
	padding: 6rem;
}

.case-items-wrapper {
	display: flex;
	flex-wrap: wrap;
}

.case-item {
	position: relative;
	z-index: 1;
	width: 46%;
	margin: 2%;
	transform: scale(1);
	-webkit-transform: scale(1);
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
	text-decoration: none !important;
}

.case-item:hover {
	background: #f8f8f8;
}



.case-image {
	height: 40rem;
	overflow: hidden;
}

.case-image img {
	object-fit: cover;
	height: 100% !important;
	width: 100% !important;
}

.case-image.c30 img {
	object-position: center center;
	object-fit: cover;
}

.case-text {
	margin: 0 auto;
	padding: 5rem 3rem;
	width: 100%;
	z-index: 2;
	transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
}


.case-text .case-heading {
	line-height: 1.3;
	padding-bottom: 1rem;
	font-size: 2.2rem;
	font-weight: 700;
}


.case-text a {
	text-decoration: none;
	font-size: 2rem;
	padding-bottom: 0;
}

.case-text p {
	text-align: left;
	max-width: 70rem;
}

@media only screen and (max-width: 950px) {
	.case-item {
		width: 100%;
		margin: 4rem 3rem;
	}

	.case-text {
		padding: 3rem 0;
	}

	.case-item:hover {
		background-color: transparent;
	}
}

@media only screen and (max-width: 340px) {
	.case-image {
		height: 25rem;
	}
}


/* ==========================================================================
Undersida: Nyheter
========================================================================== */
.news-grid {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
}

.news-item {
	width: 100%;
	background: #f8f8f8;
	margin: 0 0 2rem 0;
	padding: 2rem;
	display: flex;
	flex-wrap: wrap;
	text-decoration: none !important;
	-moz-transition: 0.2s ease-in-out;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}

.news-item:hover {
	background-color: #f1f1f1;
}

.news-item * {
	width: 100%;
}

.news-item .news-title {
	font-size: 1.8rem;
	font-weight: 700;
	order: 1;
	padding: 0;
	max-width: 80rem;
	line-height: 1.6;
}

.news-item:hover .news-title {
	color: #3D7BA0;
}

.news-item .date {
	font-size: 1.5rem;
	padding-bottom: 2rem;
	color: #4b4b4b;
}

.news-item-link {
	font-weight: 500;
}

.news .light-theme a,
.news .light-theme span {
	float: left;
	color: #6c6c6c;
	font-size: 1.5rem;
	line-height: 4.4rem;
	font-weight: normal;
	text-align: center;
	border: 1px solid #c6c6c6;
	background: transparent;
	min-width: 14px;
	padding: 5px 16px;
	margin: 0 5px 0 0;
	border-radius: 3px;
	box-shadow: none;
	-moz-transition: 0.3s ease-in-out;
	-webkit-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}

.news .light-theme a:hover,
.news .light-theme span:hover {
	background: #efefef;
}

.news .light-theme .active span {
	background: #efefef;
}


@media only screen and (max-width: 610px) {
	.simple-pagination li {
		margin: 2px !important;
	}
}




/* ==========================================================================
Undersida: Respektive nyhetssida
========================================================================== */

/*Specialare */
.big-birthday-cake .fas {
	font-size: 7rem;
	color: #5999c9;
}

.news-banner-image.tcg-jul-2020 {
	height: auto;
	max-width: 50rem;
}



/* Banners för respektive sida
========================================================================== */
.LayoutPage .news-banner .section-block {
	padding: 2rem;
	margin-top: 7rem;
}

.LayoutPage .news-banner .section-block-wrapper {
	max-width: none;
}

.news-banner-image {
	/* max-height: 60rem; */
	overflow: hidden;
	margin: 0 auto;
	text-align: center;
	max-width: 90rem;
	margin-bottom: 1rem;
}

.news-banner-image img {

	width: 100% !important;
}

.news-banner-image.tcg-jul-2020 img {
	object-position: center bottom;
}


/* Innehall för respektive sida
========================================================================== */
.LayoutPage .news-content .section-block {
	padding: 8rem 2rem;
}

.LayoutPage .news-content .normaltext-type {
	text-align: left;
	max-width: 90rem;
}

.LayoutPage .news-content .page-heading {
	padding-bottom: 1rem;
	max-width: 70rem;
}

.LayoutPage .news-content .news-date {
	color: #656565;
	padding-bottom: 3rem;
}

.LayoutPage .news-content .split-wrapper {
	margin-top: 2rem;
}

.LayoutPage .news-content .split-content {
	padding: 0rem 3rem;
	text-align: left;
}

/* Special news */
.float-left {
	width: 200px;
	height: 200px;
	float: left;
	margin: 0 1.5rem 0 0;
}

.LayoutPage .news-content .coworker-user {
	padding: 2rem 0 0;
}

@media only screen and (max-width: 1080px) {
	.LayoutPage .news-content .split-content {
		text-align: left;
	}
}

/* ==========================================================================
Undersida: Team
========================================================================== */
.LayoutPage .team .section-block-wrapper {
	max-width: 150rem;
}

.LayoutPage .team .section-block {
	padding: 0 2rem 6rem;
}

.LayoutPage .team {
	background-color: #f1f1f1;
}

.coworker-items-wrapper {
	display: flex;
	flex-wrap: wrap;
}

.coworker-item {
	display: flex;
	flex-wrap: wrap;
	padding: 4rem 3rem;
	background-color: #fff;
	width: 31%;
	margin: 1%;
}

.coworker-content {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin-bottom: 2rem;
}


.coworker-item .coworker-image {
	width: 12rem;
	height: 12rem;
	margin-right: 2rem;
	border-radius: 50%;
	overflow: hidden;
	align-self: center;
	margin-bottom: 2rem;
}

.coworker-item .coworker-image img {
	object-fit: cover;
	height: 100% !important;
	width: 100% !important;
}

.coworker-item .coworker-image img.farhang {
	object-position: center top !important;
}

.coworker-user {
	width: 60%;
	align-self: center;
}

.coworker-user .contact-option::before {
	font-size: inherit;
}

.coworker-user .name {
	font-size: 2rem;
	line-height: 1.1;
	padding-bottom: 0;
}

.coworker-user .title {
	font-size: 1.6rem;
	color: #638CB8;
	padding: 0;
}


.coworker-descr {
	width: 100%;
}

.coworker-quote .descr p {
	position: relative;
}

@media only screen and (max-width: 1365px) {

	.coworker-item .coworker-image {
		width: 15rem;
		height: 15rem;
	}

	.coworker-user {
		width: 100%;
		margin-top: 2rem;
	}
}

@media only screen and (max-width: 1100px) {
	.coworker-item {
		width: 48%;
	}
}

@media only screen and (max-width: 600px) {
	.coworker-item {
		width: 100%;
		margin: 0 0 3rem 0;
	}
}

@media only screen and (max-width: 550px) {
	.coworker-item {
		padding: 2rem;
	}
}




/* ==========================================================================
Undersida: Kontakta oss
========================================================================== */
.LayoutPage .contact-form .section-block-wrapper {
	max-width: 140rem;
	display: flex;
	flex-wrap: wrap;
}

.LayoutPage .contact-form {
	background: #fff;
}

.LayoutPage .contact-form .section-block {
	padding-top: 5rem;
}


.LayoutPage .contact-form .col-0 {
	width: 55%;
	background-color: transparent;
	order: 0;
	padding: 2rem;
	display: flex;
	z-index: 5;
	position: relative;
	padding-left: 5rem;
}

.LayoutPage .contact-form .col-0 a {
	font-weight: 600;
}

.LayoutPage .contact-form .col-0 .col-wrapper {
	align-self: center;
}

.LayoutPage .contact-form .col-1 {
	padding: 3rem;
	width: 45%;
	order: 1;
	background: #215872;
	height: 100%;
	min-height: 55rem;
	display: flex;
	margin-top: -15rem;
	z-index: 1;
}

.LayoutPage .contact-form .col-0 * {
	text-align: left;
}

.LayoutPage .contact-form .fas {
	padding-right: 1rem;
	color: #EC4812;
}


.LayoutPage .contact-form h4 {
	font-size: 2rem;
	font-weight: bold;
	padding-top: 2rem;
}

/* Contact form  */
.LayoutPage .contact-form .section-block .Contact .ContactForm {
	display: flex;
	flex-wrap: wrap;
}

.LayoutPage .contact-form .section-block .Contact .ContactForm div {
	width: 48%;
	margin: 1%;
}

.LayoutPage .contact-form .section-block .Contact .ContactForm div.ContactFormMessage {
	width: 100%;
}

.LayoutPage .Contact .ContactForm textarea.textmessage {
	height: 15rem;
}

.LayoutPage .contact-form .section-block .Contact .ContactForm div.ContactFormMessage p,
.LayoutPage .contact-form .section-block .Contact .ContactForm .ContactFormEmail p,
.LayoutPage .contact-form .section-block .Contact .ContactForm .ContactFormField p,
.LayoutPage .contact-form .section-block .Contact .ContactForm .ContactFormName p {
	color: #fff;

	font-weight: 400;
	font-size: 1.4rem;
	margin-bottom: 1rem !important;
}



.LayoutPage .contact-form .section-block .Contact .ContactForm input.text,
.LayoutPage .contact-form .section-block .Contact .ContactForm textarea.textmessage {
	background-color: #fff;
	padding: 2rem .5rem;
	border-radius: .4rem;
	font-weight: 400;
	color: #000;
	border: 1px solid #c9c9c9 !important;
}

.LayoutPage .contact-form .section-block .Contact .ContactForm div.ContactFormMessage {
	position: relative;
	padding-top: 0;
}

.LayoutPage .contact-form .ContactForm input.ContactSubmit {
	width: auto !important;
	max-width: none;
	padding: 1.6rem 4rem;
	border-radius: .8rem;
	background-color: #fff;
	border: 2px solid #fff !important;
	color: #000;
	display: block;
	text-align: center;
	text-transform: none;
	font-weight: 400;
	letter-spacing: 0;
	font-size: 1.5rem;
	-webkit-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
	font-family: inherit;
	height: auto !important;
	max-width: 50rem;
	margin-left: auto;
}

.LayoutPage .contact-form .ContactForm input.ContactSubmit:hover {
	background-color: transparent !important;
	border: 2px solid #fff !important;
	color: #fff !important;
}



.LayoutPage .contact-form .LayoutPage .layout-2 .form-part textarea.textmessage,
.LayoutPage .contact-form .LayoutPage .layout-2 .form-part input.text,
.LayoutPage .contact-form .LayoutPage .contact-form .LayoutPage .layout-5 .col-1 .form-part textarea.textmessage,
.LayoutPage .layout-5 .col-1 .form-part input.text,
.LayoutPage .contact-form .LayoutPage .layout-6 .col-0 .form-part textarea.textmessage,
.LayoutPage .contact-form .LayoutPage .layout-6 .col-0 .form-part input.text {
	width: 100%;
}

.section-block ::placeholder {
	font-family: 'sofia-pro', serif;
	color: #696969;
	font-weight: 400;
	font-style: normal;
	text-decoration: none;
	font-size: 15px;
	letter-spacing: 1px;
}


@media screen and (-ms-high-contrast: active),
screen and (-ms-high-contrast: none) {


	.LayoutPage .contact-form .ContactForm input:not(.ContactSubmit),
	.LayoutPage .contact-form .ContactForm textarea {
		padding: 0 !important;
	}

}

@media only screen and (max-width: 1024px) {

	.LayoutPage .contact-form .col-block {
		width: 100%;
		margin-bottom: 1rem;
	}

	.LayoutPage .contact-form .col-0 {
		order: 0;
		height: auto;
		padding: 0;
		display: block;
	}

	.LayoutPage .contact-form .col-1 {
		height: auto;
		min-height: auto;
		order: 1;
		margin: 0;
	}


	.LayoutPage .contact-form .section-block {
		height: auto;
	}

	.LayoutPage .contact-form .section-block-wrapper {
		flex-direction: column;
	}

}

@media only screen and (max-width: 550px) {

	.LayoutPage .contact-form .col-0 {
		padding: 5rem 3rem !important;
		margin-bottom: 3rem;
	}

	.LayoutPage .contact-form .col-1 {
		padding: 2rem !important;
	}

	.LayoutPage .contact-form .section-block .Contact .ContactForm div {
		width: 100%;
		margin: 0 0 1rem 0;
	}

	.LayoutPage .contact-form .section-block {
		padding: 0;
	}

	.LayoutPage .contact-form .ContactForm input.ContactSubmit {
		width: 100% !important;
	}
}

/* Kontaktpersoner
========================================================================== */
.LayoutPage .coworkers {
	background-color: #215872;
}

.LayoutPage .coworkers .section-block-wrapper {
	max-width: 150rem;
}

.LayoutPage .coworkers .heading-type * {
	color: #fff;
	text-align: center;
}

.LayoutPage .coworkers .coworker-items-wrapper {
	justify-content: center;
}

.LayoutPage .coworkers .coworker-item {
	width: 31.333%;
	padding: 4rem 2rem;
}

.LayoutPage .coworkers .coworker-content {
	margin: 0;
	text-align: center;
	justify-content: center;
}

.LayoutPage .coworkers .coworker-content * {
	text-align: center;
}

.LayoutPage .coworkers .coworker-item .coworker-image {
	margin: 0 0 2rem 0;
	width: 20rem;
	height: 20rem;
}

.LayoutPage .coworker-user {
	width: 100%;
}

.coworker-item .contact-option {
	font-style: normal;
	display: block;
}


/* @media only screen and (max-width: 1200px) {
	.LayoutPage .coworkers .coworker-item {
		width: 31%;
	}
} */

@media only screen and (max-width: 900px) {
	.LayoutPage .coworkers .coworker-item {
		width: 48%;
	}
}

@media only screen and (max-width: 620px) {
	.LayoutPage .coworkers .coworker-item {
		width: 100%;
		margin: 0 0 2rem 0;
	}
}


/* Kartor @JoSo
========================================================================== */
.LayoutPage .maps .section-block-wrapper {
	max-width: none;
}

.maps-wrapper {
	display: flex;
	flex-wrap: wrap;
	margin-top: 2rem;
}

.maps-item {
	width: 23%;
	margin: 1%;
	position: relative;
}

.maps-heading {
	font-size: 2rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	position: absolute;
	bottom: 1px;
	left: 0;
	background-color: #3d7aa0;
	color: #fff;
	padding: 2rem 4rem;
}

@media only screen and (max-width: 1200px) {
	.maps-item {
		width: 48%;
	}
}

@media only screen and (max-width: 950px) {
	.maps-item {
		width: 100%;
		margin: 0 0 3rem 0;
	}

	.maps-item iframe {
		height: 45rem;
	}
}

/* ==========================================================================
Dolda undersidor / Informationssidor 
========================================================================== */
.LayoutPage .info-section .section-block * {
	text-align: left;
}

.LayoutPage .info-section .section-block-wrapper {
	max-width: 90rem;
}

.LayoutPage .info-section .normaltext-type {
	margin: 0;
}

/* ==========================================================================
Footer
========================================================================== */
.footer {
	background-color: #fff;
	padding: 0;
	color: #111;
	position: relative;
}

.footer .container {
	padding: 0;
	max-width: none;
}

.footer .footer-heading {
	font-size: 1.6rem;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: .1em;
	padding-bottom: 2rem;
	color: #215972;
}

.footer p,
.footer a {
	text-align: left;
	font-size: 1.6rem;
	color: #000;
}

.footer a:hover {
	color: inherit;
}

.footer-container {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: space-between;
	padding: 7rem 0 0;
	position: relative;
}

.footer-logo-wrapper {
	width: 20rem;
	margin: 0 auto 10rem;
}

.footer-logo {
	width: 100%;
}

/* FOOTER MENU */
.footer-nav {
	width: 100%;
	margin-bottom: 5rem;
	padding: 0 4rem;
	text-align: right;
}

.footer-menu-wrapper {
	display: flex;
	flex-wrap: wrap;
	list-style-type: none;
	padding-inline-start: 0;
	margin: 0;
}

.footer-menu {
	text-align: left;
	width: 25%;
}

.footer-menu:first-child {
	width: 20%;
}

.footer-menu:last-child {
	width: 30%;
}

/* FOOTER SUBMENU */
.footer-submenu {
	padding-inline-start: 0;
	list-style-type: none;
}

.footer-submenu li {
	text-align: left;
}

.footer-menu-link {
	font-size: 1.6rem;
	line-height: 2em !important;
}

.footer-menu-link:hover {
	color: #333;
	text-decoration: underline;
}

/* FOOTER SOCIAL LINKS */
.footer .social-list {
	display: flex;
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer .social {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0;
	width: 3.5rem;
	height: 3.5rem;
	margin-right: 1rem;
	padding: 0;
	border-radius: 2rem;
	background-color: #fff;
	color: #000;
}

.footer .social:hover {
	background-color: #000;
	color: #ffffff;
	text-decoration: none;
}

.footer .social::before {
	font-family: 'Font Awesome 5 Brands';
	font-weight: 400;
	font-size: 1.5rem;

	position: relative;
	top: 1px;
}

.social-facebook::before {
	content: '\f39e';
}

.social-linkedin::before {
	content: '\f0e1';
}

.social-instagram::before {
	content: '\f16d';
}

.social-youtube::before {
	content: '\f167';
}

/* Footer Bottom */
.footer-bottom {
	background-color: #235872;
	margin: 0 auto;
	width: 100%;
	padding: 2rem;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap-reverse;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	line-height: 1rem;
}

.footer-bottom p,
.footer-bottom a {
	font-size: 1.3rem;
	padding: 0;
	color: #fff;
}

.footer-bottom a:hover {
	color: #fff;
}

.footer ul.info-list {
	list-style: none;
	display: flex;
	padding: 0;
	margin: 0;

}

.footer ul.info-list li {
	display: flex;
	align-items: center;
	align-self: center;
	justify-content: center;
}

/* WebbEss Stamp  */
.webbess-stamp {
	display: flex;
	align-items: center;
	padding: 0;
	font-size: 1.3rem;
	font-weight: normal;
	margin-top: 1rem;
	font-weight: 300;
}

.webbess-stamp img {
	width: 3rem;
	margin-left: 1rem;
	filter: invert();
}

@media only screen and (max-width: 1200px) {

	.footer-menu,
	.footer-menu:first-child,
	.footer-menu:last-child {
		width: 50%;
		margin-bottom: 3rem;
	}
}

@media only screen and (max-width: 750px) {


	.footer-bottom {
		padding: 2rem;
		flex-direction: column;
		align-self: normal;
		align-items: normal;
	}

	.footer-nav {
		padding: 0 2rem;
	}

	.footer-menu-wrapper {
		flex-wrap: wrap;
	}

	.footer-menu,
	.footer-menu:first-child,
	.footer-menu:last-child {
		width: 100%;
		margin-bottom: 3rem;
	}

	.footer-logo-wrapper {
		width: 20rem;
		margin: 0 0 4rem;
	}

	.footer ul.info-list {
		flex-direction: column;
		width: 100%;
	}

	.footer ul.info-list li {
		align-self: flex-start;
		width: 100%;
		padding: 2rem 0;
		justify-content: flex-start;
	}

	.footer .social-list {
		width: 100%;
	}

}

@media only screen and (max-width: 750px) {

	.footer .uc-sigill img {
		max-width: 29rem !important;
	}

}