/* EFK AB */

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

/* Hero New (sans-serif) */
@import url("https://use.typekit.net/oge8uef.css");

/* ==========================================================================
  Generellt
========================================================================== */
:root {
    /* 	Colors */
    --primary-color: 56, 56, 56;
	--secondary-color: 233, 129, 25;

    --black-color: 17, 17, 17;
    --gray-dark-color: 58, 58, 58;
    --gray-light-color: 240, 240, 240;
    --white-color: 255, 255, 255;

}

/* Layout
========================================================================== */

*,
*::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%;
}

body {
	background-position: center center;
	overflow-x: hidden !important;
}

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

.display-none {
	display: none;
}

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

/* Skydd för högerklick */
img {
	pointer-events: none;
}

/* Layout
========================================================================== */
.LayoutPage .section-block,
.SubPage .LayoutPage .section-block {
	padding: 10rem 5rem;
}

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

/* Speciella bredder  */

.mw-900 .section-block .section-block-wrapper {
	max-width: 90rem;
}

.mw-1200 .section-block .section-block-wrapper {
	max-width: 120rem;
}
.mw-1400 .section-block .section-block-wrapper {
	max-width: 140rem;
}
.mw-1500 .section-block .section-block-wrapper {
	max-width: 150rem;
}

.mw-1700 .section-block .section-block-wrapper {
	max-width: 170rem;
}

.mw-2000 .section-block .section-block-wrapper {
	max-width: 200rem;
}

.mw-none .section-block .section-block-wrapper {
	max-width: none;
}

/* Speciella höjder  */
.mh-55{
	min-height: 50rem !important;
}

.mh-55vh {
	min-height: 55vh;
}

/* speciell padding */
.p-1{
	padding: 1rem !important;
}

.p-2{
	padding: 2rem;
}

.p-3{
	padding: 3rem;
}

.p-6{
	padding: 7rem;
}

.pt-0 .section-block {
	padding-top: 0;
}

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

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

.pr-0:not(.section-wrapper),
.pr-0 .section-block {
	padding-right: 0;
}

.pl-0:not(.section-wrapper) {
	padding-left: 0;
}

.LayoutPage .py-0:not(.section-wrapper) {
	padding-top: 0;
	padding-bottom: 0;
}

.LayoutPage .pb-0 .section-block,
.SubPage .LayoutPage .pb-0 .section-block {
	padding-bottom: 0;
}

.pb-2 .section-block,
.pb-2:not(.section-wrapper) {
    padding-bottom: 2rem ;
}

.pb-8 {
	padding-bottom: 8rem;
}

.LayoutPage .p-0 .section-block {
	padding: 0;
}
/* speciell Paddings*/

.pl-0{
	padding-left: 0;
}
.p-3{
	padding: 3rem;
}

/* speciell Margins*/
.mb-1 {
	margin-bottom: 1rem !important;
}
.mb-2 .section-block,
.mb-2:not(.section-wrapper) {
	margin-bottom: 2rem !important;
}
.mb-4 .section-block,
.mb-4:not(.section-wrapper) {
	margin-bottom: 10rem !important;
}
.mt-1{
	margin-top: 1rem !important;
}
.mt-3{
	margin-top: 3rem;
}
.mt-10{
	margin-top: 10rem;
}

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

	.LayoutPage .section-block,
	.SubPage .LayoutPage .section-block {
		padding: 8rem 3rem;
	}
	.LayoutPage .p-0 .section-block {
		padding: 0;
	}
	.p-6{
		padding: 3rem;
	}
}

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

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

	.LayoutPage .pb-0 .section-block,
	.SubPage .pb-0 .section-block {
		padding-bottom: 0;
	}

	.LayoutPage .p-0 .section-block {
		padding: 0;
	}
}

/* Text och typsnitt
========================================================================== */
body {
	font-family: hero-new, sans-serif;
}

/* Rubriker */
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: inherit;
	font-weight: 400;
	font-style: normal;
	letter-spacing: 0;
	line-height: 1.3;
	color: #111;
	text-transform: normal;
	padding: 0 0 .3em;
}

.section-title {
	font-size: 3.7rem;
	font-weight: 400;

}

.sub-title {
	font-size: 3rem;
}

.small-title {
	font-size: 2rem;
	font-weight: 400;
}

.text-label {
	font-family: inherit;
	font-weight: 500;
	font-size: 1.4rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	padding-bottom: 1em;
	color: rgba(233,129,25);
}

/* Brodtext och lankar */
.ingress {
	font-size: 1.7rem;
}

p {
	line-height: 1.8;
	font-size: 1.4rem;
	color: #333;
	font-family: inherit;
	font-weight: 400;
	text-decoration: none;
}

a,
li {
	line-height: inherit;
	font-size: inherit;
	color: inherit;
	font-family: inherit;
	font-weight: inherit;
}

a:hover {
	text-decoration: underline;
	color: #383838;
}

.bold {
	font-weight: 600;
}
.text-normal{
	font-size: 1.4rem;
}
/* ovriga klasser */

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

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

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

.text-block {
	max-width: 60rem;
	margin: 0;
}
.text-block-wide {
	max-width: 75rem;
	margin: 0;
}

.text-center {
	text-align: center !important;
}
.text-left{
	text-align: start;
}
.justify-center{
	justify-content: center !important;
}

/* Styled list */
.styled-list {
	display: flex;
	flex-direction: column;
	list-style: none;
}

.styled-list li::before {
	position: absolute;
	content: "\f00c";
	display: flex;
	justify-content: center;
	align-items: center;
	top: 0;
	left: -4rem;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 3rem;
	font-family: "Font Awesome 5 Pro";
	font-weight: 300;
	font-size: 1.4rem;
	color: #e98119 ;
	background-color: hsl(24, 32%, 69%, .3);
}

.styled-list li {
	position: relative;
	line-height: 1.8;
	font-weight: 400;
	margin-bottom: 1em;
}

/* Listor */
.list-pills {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 100rem;
    padding: 0;
    margin: 0 auto;
    list-style: none;
}

.list-pills.left {
	justify-content: left;
}

.list-pills li {
    display: flex;
    align-items: center;
    padding: 0.5rem 2rem 0.5rem 0.5rem;
    margin: .5rem;
    font-size: 1.5rem;
    border-radius: 4rem;
    color: rgb(var(--black-color));
    background: rgb(var(--secondary-color), .3);
}

.list-pills li::before {
    content: '\f00c';
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    flex-shrink: 0;
    margin-right: 1rem;
    border-radius: 50%;
    font-size: 1.5rem;
    font-family: 'Font Awesome 5 Pro';
    border-radius: 50%;
    color: rgb(var(--white-color));
    background: rgb(var(--secondary-color));
}

@media only screen and (max-width: 580px) {
    .list-pills li {
        width: 100%;
        padding: 1rem;
        font-size: 1.4rem;
    }
}

@media only screen and (max-width: 1024px) {
	.section-title {
		font-size: 3.2rem;
	}

	.sub-title {
		font-size: 2.7rem;
	}

	.small-title {
		font-size: 2rem;
	}
}

@media only screen and (max-width: 580px) {
	.section-title {
		font-size: 2.5rem;
	}

	.sub-title {
		font-size: 2.2rem;
	}

	.small-title {
		font-size: 1.8rem;
	}

	.ingress {
		font-size: 1.5rem;
	}
}

/* Knappar & speciella lankar
========================================================================== */
.btn,
.js-show-more-text {
	max-width: 50rem;
	width: auto;
	padding: 1.4rem 3.5rem;
	border-radius: 8px;
	text-align: center;
	text-transform: uppercase;
	font-weight: 500;
	font-size: 1.2rem;
	letter-spacing: .1em;
	line-height: 1em;
	-webkit-transition: all .4s ease;
	transition: all .4s ease;
	display: inline-block;
}

.btn::after,
.js-show-more-text::after {
	display: inline-block;
	content: ' \2023';
	margin-left: .5rem;
	transition: all .4s ease;
}

.btn-big{
	font-size: 1.4rem;
	font-weight: 300;
}

.btn:hover::after {
	transform: translateX(1rem);
	transition: all .4s ease;
}

.btn-white,
.btn-white:hover,
.js-show-more-text {
	background-color: #FFF;
	border-color: #FFF;
	color: #111;
}

.btn-link,
.btn-link:hover {
	background-color: transparent;
	border-color: transparent;
	color: #FFF;
}

.btn-primary,
.btn-primary:hover {
	background-color: #caab96;
	border-color: #caab96;
	color: #FFF;
}

.btn-taube,
.btn-taube:hover {
	background-color: rgb(219, 213, 205);
	border-color: rgb(219, 213, 205);
	color: #000000;
}
.btn-beige,
.btn-beige:hover {
	background-color: rgb(251, 224, 209);
	border-color: rgb(251, 224, 209);
	color: #000000;
}


.btn-gray, .btn-gray:hover {
	background-color: #5f5f5f;
	border-color: #5f5f5f;;
	color: #fff;
}

.btn-primary-light {
	background-color: #ece1da;
	border-color: #ece1da;
	color: #111;
}

.btn-primary-light:hover {
	background-color: #c9ab97;
	border-color: #caab96;
	color: #FFF;
}

.btn-large {
	font-size: 1.6rem;
	text-transform: none;
	letter-spacing: 0;
	text-align: left;
}

.btn-large::after {
	float: right;
	position: relative;
}

.btn-large::after {
	content: ' \f0a9';
	font-family: 'Font Awesome 5 Pro';
	display: inline-block;
	margin-left: .3rem;
	transition: transform .4s ease;
	color: rgb(var(--primary-color));
}

.btn-large:hover::after {
	transform: translateX(.7rem);
	transition: transform .4s ease;
}

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

.btn-wrapper.center {
	display: flex;
	justify-content: center;
}

/* Arrow Link  */
.arrow-link {
	text-transform: uppercase;
	font-weight: 500;
	font-size: 1.2rem;
	letter-spacing: .1em;
	line-height: 1em;
	-webkit-transition: all .4s ease;
	transition: all .4s ease;
	display: inline-block;
}

.arrow-link:hover {
	text-decoration: none;
}

.arrow-link::after {
	display: inline-block;
	content: ' \2023';
	margin-left: .5rem;
	transition: all .4s ease;
}

.arrow-link:hover::after {
	transform: translateX(1rem);
	transition: all .4s ease;
}

@media only screen and (max-width: 480px) {
	.btn {
		display: block;
		width: 100%;
	}

	.btn-wrapper .btn {
		margin: 1.5rem 0;
	}
}

/* Cards
========================================================================== */
.cards-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.cards-wrapper.align-left {
	justify-content: flex-start;
}

.cards-wrapper .card-item.align-center {
    align-self: center;
}

.card-item {
	width: 100%;
	margin: 0 0 2rem;
}

.card-item .image-wrapper {
	width: 100%;
}

.card-item .image-wrapper img {
	object-fit: cover;

}

/* Card grow */
.cards-grow .card-item {
    display: flex;
    flex-direction: column;
}

.cards-grow .card-body {
    flex-grow: 1;
}
/* Specifika bredder */
.cards-wrapper.w-50 .card-item {
	width: calc((100% / 2) - 1rem);
}

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

.cards-wrapper.w-25 .card-item {
	width: calc((100% / 4) - 1rem);
}

.cards-wrapper.w-20 .card-item {
	width: calc((100% / 5) - 1rem);
}

.cards-wrapper .card-item.w-100 {
	width: 100% !important;
}

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

@media only screen and (max-width: 1200px) {
	.cards-wrapper.w-25 .card-item {
		width: calc((100% / 2) - .5rem);
		margin: 0 0 1rem;
	}

	.cards-wrapper.w-33 .card-item {
		width: calc((100% / 2) - 2rem);
	}
}

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

	.cards-wrapper.w-20 .card-item {
		width: calc((100% / 3) - 1rem);
	}

	.cards-wrapper.w-50 .card-item,
	.cards-wrapper.w-33 .card-item {
		width: 100%;
		margin: 1rem 0;
	}

	.cards-wrapper.w-25 .card-item {
		width: 100%;
	}
}


/* Cards 2 */
.cards-2 .card-item {
	display: flex;
	flex-direction: column;
	padding: 3rem;
	border-radius: 2px;
	cursor: pointer;
	transition: 0.2s ease-in-out;
	background-color: rgb(219, 213, 205);
}

.cards-2 .icon-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 7rem;
	height: 7rem;
	padding: 2rem;
	/* margin-bottom: 3rem; */
	text-align: left;
	border-radius: 1rem;
	border: 2px solid #F2F2F2;
}

.cards-2 .icon-wrapper i {
	color: #fff;
	font-size: 3.5rem;
}

.cards-2 .text-wrapper {
	margin: 0;
}

.cards-2 .btn-wrapper {
	margin: auto 0 0;
}

.cards-2 p,
.cards-2 a {
	font-size: 1.4rem;
	color: #F2F2F2;
}

.cards-2 p:not(.arrow-link) {
	padding-bottom: 2rem;
}

.cards-2 .small-title {
	padding-bottom: 1em;
}

/* Andra boxen 
.cards-2 .card-item:nth-child(2) {
	background-color: #525252;
}*/

/* Forsta boxen 
.cards-2 .card-item:nth-child(1) {
	background-color: #525252;
}*/

/* Tredje boxen 
.cards-2 .card-item:nth-child(3) {
	background-color: #262626;
}*/

.cards-2 .card-item:hover {
	background-color: rgb(188, 183, 177) !important;
	transition: 0.2s ease-in-out;
	text-decoration: none;
}

@media only screen and (max-width: 1200px) {
	.cards-2 .card-item {
		padding: 2.5rem;
	}
}

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

	.cards-2 .card-item {
		padding: 2rem;
	}

	.cards-2 .icon-wrapper {
		width: 5rem;
		height: 5rem;
		padding: 1rem;
		margin-bottom: 2rem;
	}

	.cards-2 .icon-wrapper i {
		font-size: 2.5rem;
	}
}

/* Card 2-1 */
.card-2-1 a.card-item:hover {
    background: rgb(188, 183, 177);
	text-decoration: none;
}

.card-2-1 .card-header {
    margin-bottom: 2rem;
    font-size: 5rem;
}
/* Card 2-3 */
.card-2-3 .card-item {
    border-radius: 1rem;
}

.card-2-3 .card-header {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 7rem;
    height: 7rem;
    padding: 2rem;
    margin: -1rem 0 0 -1rem;
    border-radius: 50%;
}
/* Card 3-1 */
.card-3-1 .card-item {
    border-radius: 1rem;
    overflow: hidden;
}

.card-3-1 .image-wrapper {
    height: 25rem;
}


/* Card 3-4 */
.card-3-4 .card-item {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.card-3-4 .image-wrapper {
    width: 14rem;
    height: 14rem;
    margin: 1rem;
    border-radius: 50%;
}

.card-3-4 .card-body {
    flex: 1 1 0px;
}

.card-3-4 .contact-item i {
    margin-right: 1rem;
}


@media only screen and (max-width: 900px) {
    .card-3-4 .card-item {
        flex-direction: column;
        align-items: flex-start;
        padding: 1rem;
    }
}

@media only screen and (max-width: 580px) {
    .cards-wrapper.card-3-4 .card-item {
        width: 100%;
        margin: 1rem 0;
    }
}


/* Cards 11 */
.cards-11 .card-item {
	overflow: hidden;
	position: relative;
}

.cards-11 .text-label {
	font-weight: 700;
	color: #e98119;
}

.cards-11 .image-wrapper {
	position: relative;
	width: 100%;
	padding-top: 100%;
}

.cards-11 img {
	position: absolute;
	width: 100%;
	height: 100%;
	object-fit: cover;
	top: 0;
	left: 0;
}

.cards-11 .text-wrapper {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-start;
	padding: 1.5rem;
	margin: 0;
}

.cards-11 .small-title {
	font-size: 1.6rem;
	font-weight: 700;
}

.cards-11 p,
.cards-11 a {
	display: block;
	padding-bottom: .3rem;
	font-size: 1.3rem;
	text-decoration: none;
}

.cards-11 em {
	margin-right: 1rem;
}

.cards-11 .socials {
	margin-top: 1rem;
}

.cards-11 .socials a:hover {
	text-decoration: underline;
}

@media only screen and (max-width: 550px) {
	.cards-11 .text-wrapper {
		padding: 0;
	}
}

/* Cards 14 */
.cards-14 .card-item {
	position: relative;
	display: flex;
	width: 100%;
	padding: 2rem;
	transition: all .3s ease;
}

.cards-14 a.card-item:hover {
	text-decoration: none;
	background-color: rgba(0, 0, 0, 0.1);
	transition: all .3s ease;
}

.cards-14 i {
	width: 5rem;
	font-size: 3rem;
	color: #e98119;
}

.cards-14 p {
	padding-bottom: 0;
	font-size: 1.4rem;
}

.cards-14 .contact-info {
	display: block;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.8;
}

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

	.cards-14 .card-item {
		padding: 2rem 0;
	}

	.cards-14 i {
		width: 4rem;
		font-size: 2.5rem;
	}
}

/* Cards 15 */
.cards-15 .card-item {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 35rem;
}

.cards-15 .card-item:hover {
	text-decoration: none;
}

.cards-15 .image-wrapper {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 2px;
}

.cards-15 .image-wrapper::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .2);
	transition: .3s ease;
}

.cards-15 .card-item:hover .image-wrapper::after {
	background: rgba(0, 0, 0, .4);
}

.cards-15 .text-wrapper {
	z-index: 1;
	position: relative;
	padding: 2rem;
	margin: 0;
	text-align: center;
}

.cards-15 .sub-title,
.cards-15 p {
	color: #FFF;
}

/* Farger
========================================================================== */
/* text-farger */
.text-primary {
	color: #383838;
}

.text-secondary {
	color: #e98119;
}

.text-white {
	color: #FFF;
}

.text-black {
	color: #000000;
}

.text-muted {
	color: #F2F2F2;
}

/* bakgrundsfarger */
.bg-primary,
.bg-primary .section-block {
	background-color: #383838;
}

.bg-gray .section-block {
	background-color: #F2F2F2;
}

.bg-beige,
.bg-beige-color .section-block {
	background-color: rgb(202, 171, 150);
}

.bg-beige-dark-color,
.bg-beige-dark-color .section-block {
	background-color: rgb(191, 160, 155);
}
.bg-taube,
.bg-taube .section-block {
	background-color: rgb(219, 213, 205);
}

.bg-gray-light{
	background-color: rgb(203, 203, 203) !important;
}

.bg-black .section-block {
	background-color: #111;
}

.bg-dark {
	background-color: #444 !important;
}

.bg-gray-dark {
	background-color: #444 !important;
}

.bg-dark * {
	color: #fff;
}

.gradient-black-gray .section-block {
	background-image: linear-gradient(to bottom, #333 50%, #f2f2f2 50%);
}

.gradient-gray-white .section-block {
	background-image: linear-gradient(to bottom, #f2f2f2 80%, #FFF 80%);
}

.box-shadow{
	box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.1);
}

/* Borders
========================================================================== */
.no-border{
	border: none !important;
}
.border-top {
	border-top: 2px solid #444;
	padding-top: 1rem;
}
.br-0{
	border-radius: 0 !important;
}
.br-2{
	border-radius: 2rem !important;
}
.br-50{
border-radius: 50%;
}

/* Grafiska element */
.black-white{
	filter: grayscale();
}

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

.split-wrapper {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	position: relative;
}

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

.split-content {
	position: relative;
	z-index: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50%;
	padding: 7rem;
	text-align: left;
}

.IndexPage .split-content {
	padding-right: 0;
}

.split-text {
	max-width: 65rem;
}

.split-image,
.split-video {
	width: 50%;
	position: relative;
	overflow: hidden;
	border-radius: 2px;
}

.split-video {
	min-height: 54rem;
}

/* Centrera content */
.split-wrapper .align-center {
    align-self: center;
}


.split-wrapper .w-30 {
	width: 30%;
}

.split-wrapper .w-70 {
	width: 70%;
}

.split-wrapper .w-40 {
	width: 40%;
}

.split-wrapper .w-60 {
	width: 60%;
}

.split-image.mh-70 {
	max-height: 70rem;
	align-self: center;
}

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

.split-image.mh-80 {
	max-height: 80rem;
	align-self: center;
	padding-right: 6rem;
}

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

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

.split-video video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.split-wrapper .section-title {
	border-top: 2px solid #000;
	padding-top: 2rem;
	margin-top: 2rem;
}

/* Object fit */
.of-wrapper {
	position: relative;
	overflow: hidden;
}

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

@supports (object-fit: cover) {

	.split-image img {
		position: relative;
		transform: none;
		top: unset;
		left: unset;
		object-fit: cover;
		object-position: center;
		height: 100% !important;
		width: 100% !important;
	}

	.of-wrapper img {
		position: static;
		transform: none;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}

	.of-wrapper img.contain {
		object-fit: contain;
	}
}

/* Split image med grid */
.split-images-grid {
	justify-content: space-between;
	background-color: #FFF;
	box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, .05);
	border-radius: 5px;
	padding-right: 1rem;
}

.split-images-grid .split-content {
	padding: 7rem 4rem;
	border-radius: 2px;
	width: calc(50% - 1rem);
}

.split-image-grid {
	display: -ms-grid;
	display: grid;
	grid-template-columns: 1fr 1fr;
	-ms-grid-columns: 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	-ms-grid-rows: 1fr 1fr;
	gap: 1rem;
	width: 50%;
}

.split-image-grid .grid-image {
	position: relative;
	width: 100%;
}

.split-image-grid>.grid-image:nth-child(1) {
	grid-column: 1 / 1;
	-ms-grid-column: 1;
	grid-row: 1 / 3;
	-ms-grid-row: 1;
}

.split-image-grid>.grid-image:nth-child(2) {
	grid-column: 2 / 2;
	-ms-grid-column: 2;
	grid-row: 1 / 1;
	-ms-grid-row: 1;
}

.split-image-grid>.grid-image:nth-child(3) {
	grid-column: 2 / 2;
	-ms-grid-column: 2;
	grid-row: 2 / 2;
	-ms-grid-row: 2;
}


.el .split-image-grid>.grid-image:nth-child(1) {
	grid-column: 1 / 1;
	-ms-grid-column: 1;
	grid-row: 1 / 1;
	-ms-grid-row: 1;
}

.el .split-image-grid>.grid-image:nth-child(2) {
	grid-column: 2 / 2;
	-ms-grid-column: 2;
	grid-row: 1 / 1;
	-ms-grid-row: 1;
}

.el .split-image-grid>.grid-image:nth-child(3) {
	grid-column: 2 / 2;
	-ms-grid-column: 2;
	grid-row: 2 / 2;
	-ms-grid-row: 2;
}


.el .split-image-grid>.grid-image:nth-child(4) {
	grid-column: 1 / 1;
	-ms-grid-column: 2;
	grid-row: 2 / 2;
	-ms-grid-row: 2;
}

 .split-image-grid .split-image {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

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

	.split-content {
		padding: 5rem;
	}

	/* Full width split */
	.full-width-split .split-content,
	.full-width-split .split-image,
	.full-width-split .split-video {
		width: 100%;
	}

	.full-width-split .split-image {
		max-height: 35rem;
	}

	.full-width-split .split-image-grid .split-image {
		max-height: none;
	}

	.full-width-split .split-content {
		padding: 5rem;
	}

	.full-width-split .split-text {
		max-width: none;
		columns: 40rem 2;
		column-gap: 2rem;
	}

	.full-width-split :is(.text-label, .section-title) {
		column-span: all;
	}

	.full-width-split .styled-list li {
		-webkit-column-break-inside: avoid;
		page-break-inside: avoid;
		break-inside: avoid;
	}

	.split-video {
		min-height: 30rem;
	}
}

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

	/* Full width split */
	.full-width-split .split-content {
		padding: 5rem 3rem;
	}
}

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

	.split-content {
		padding: 0 0 3rem;
		width: 100%;
	}

	.split-image,
	.split-video,
	.split-wrapper .w-30,
	.split-wrapper .w-70,
	.split-wrapper .w-40,
	.split-wrapper .w-60 {
		width: 100%;
	}

	/* Split image med grid */
	.split-images-grid {
		padding: 1rem;
	}

	.split-images-grid .split-content {
		width: 100%;
	}

	.split-image-grid {
		width: 100%;
		margin: 0;
	}

	.split-image-grid .split-image {
		position: relative;
	}
	.split-image.mh-80 {
		padding-right: 0rem;
	}

	/* Split image med grid */
	.split-images-grid .split-content {
		padding: 2rem 1rem;
	}

	/* Full width split */
	.full-width-split .split-content {
		padding: 5rem 2rem;
	}

}

/* Bakgrundsbilder och videos
========================================================================== */
/* Object fit */
.of-wrapper {
	position: relative;
	overflow: hidden;
}

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

@supports (object-fit: cover) {
	.of-wrapper img {
		position: static;
		transform: none;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}

	.of-wrapper img.contain {
		object-fit: contain;
	}
}

/* Bg Image */

.bg-image {
	position: relative;
	overflow: hidden;
}

.bg-image-wrapper,
.bg-video-wrapper {
	z-index: -1;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Video */
.bg-video-wrapper video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Bakgrundsvideo
========================================================================== */
.bg-video {
    position: relative;
    margin-top: calc(-1 * var(--menu-height));
    overflow: hidden;
	z-index: 1;
}

.bg-video-wrapper video {
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%,-50%);
}


/* Header / Navigation
========================================================================== */
.EditMode.WebbEssDIY header {
	position: relative;
	top: 10px !important;
}

/* Header  */
header {
	background-color: #FFF;
	-webkit-transition: all 300ms linear;
	-moz-transition: all 300ms linear;
	-o-transition: all 300ms linear;
	-ms-transition: all 300ms linear;
	transition: all 300ms linear;
	box-shadow: none;
	height: 8rem;
}

header .container {
	display: flex;
	max-width: none;
	padding: 0 2rem;
	transition: all 500ms linear;
}

/* HEADER LOGO */
header .header-logo {
	width: 8rem;
	padding: 0;
	margin: 0 auto 0 0;
	line-height: 8rem;
	transition: all 300ms linear;
}

header .header-logo a {
	font-family: termina, sans-serif;
	font-weight: 400;
	color: #383838;
	font-size: 2rem;
	line-height: 1.3;
	transition: all 300ms linear;
}

header .header-logo a:hover {
	text-decoration: none;
}

/* Nav */

/* Hides Hem / Home in menu */
nav.mainmenu ul.TemplateMenu>li:first-child {
	display: none;
}

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

nav.mainmenu ul.TemplateMenu>li {
	line-height: auto;
	height: auto;
	transition: all 300ms linear;
}

nav.mainmenu {
	text-align: right;
	width: auto;
}

nav.mainmenu a {
	font-family: inherit;
	font-weight: 500;
	font-size: 1.2rem;
	line-height: 8rem;
	color: #333;
	padding: 0 1rem;
	transition: all 300ms linear;
}

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

nav.mainmenu li:hover a,
nav.mainmenu li.active a {
	color: #383838 !important;
	text-decoration: none;
}

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

nav.mainmenu li:hover .expandable:after {
	text-decoration: none !important;
}

/* Dropdown navigation styling */
nav.mainmenu ul>li>ul>li {
	line-height: normal;
	height: auto;
	cursor: pointer;
	padding: 0;
}

nav.mainmenu ul>li>ul>li:hover>a:before {
	display: none;
}

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 {
	color: #caab96 !important;
	padding-bottom: 0;
}

nav.mainmenu ul>li>ul>li a {
	line-height: 3;
	padding: 0 2rem;
	color: #fff !important;
}

nav.mainmenu ul>li>ul>li a:hover {
	background-color: #282828 !important;
	color: #fff !important;
}


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

nav.mainmenu ul>li>ul {
	background: #f8f8f8;
	padding: 0;
	box-sizing: border-box;
	line-height: normal;
	height: auto;
	min-width: 100%;
	width: auto;
	text-align: left;
	z-index: 10;
	border-radius: .5rem;
	overflow: hidden;
}

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

/* CTA  */
.header-cta-wrapper {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	padding: 0;
	margin: 0;
	list-style: none;
}

.header-cta-wrapper .btn {
	min-width: unset;
	padding: 1rem 1.5rem;
	margin: 0 .5rem;
}

.header-cta-wrapper .btn::after {
	display: none;
}

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

	header .container {
		padding: 0 2rem;
	}

}

@media only screen and (min-width: 981px) {

	header.scrolled {
		background-color: #FFF;
		box-shadow: 0 1rem 2rem rgba(0, 0, 0, .05);
		transition: all 300ms linear;
	}

	header.scrolled nav.mainmenu a {
		color: #333;
		transition: all 300ms linear;
	}

	.hamburger {
		display: none;
	}
}


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

	header {
		height: 6rem;
		background-color: #FFF;
		width: 100vw !important;
	}

	header .header-logo {
		z-index: 11;
		display: block;
		width: 6rem;
		padding: 0;
		line-height: 6rem;
	}

	/* The Hamburger is by default placed on the left, use left: unset if wanted on the right side */
	.hamburger {
		left: auto;
		right: -1rem;
		z-index: 99;
	}

	.hamburger-inner {
		top: 20px;
	}

	nav.mainmenu {
		text-align: left;
		box-shadow: none;
		width: 100vw;
	}

	nav.mainmenu .Padding {
		border-top: none !important;
	}

	nav.mainmenu li a {
		font-size: 1.8rem;
		border-bottom: none;
		margin: 2rem 0;
		color: #333 !important;
		padding-left: 2rem;
		line-height: 5rem;
	}

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

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

	.dropdown-arrow {
		width: 4rem;
		height: 4rem;
		z-index: 100;
		top: 0;
		right: 2rem;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.dropdown-arrow::before {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		width: 3rem;
		height: 3rem;
		border-radius: 50%;
		font-family: 'Font Awesome 5 Pro';
		font-weight: 700;
		font-size: 1.5rem;
		content: '\f0d7';
		color: hsl(109, 16%, 51%);
		background-color: #f1f4f0;
	}

	.expandable-li.level-open .dropdown-arrow:before {
		transform: rotate(180deg);
	}

	nav.mainmenu li a.expandable::after {
		display: none;
	}

	.cta-menu {
		position: relative;
		right: 0;
		height: 6rem;
		line-height: 6rem;
	}

	.cta-menu .btn {
		font-size: 1.2rem;
		padding: .7rem 1rem;
	}
}

/* Top-section
========================================================================== */
.top-section {
	display: none;
}

.EditMode .topsection {
	padding-top: 20rem;
}

.topsection .section-block {
	padding: 0;
	margin-top: 8rem;
}

/* Link Wrapper */
.links-wrapper {
	display: flex;
	flex-wrap: wrap;
	position: relative;
}

.link-item {
	position: relative;
	z-index: 1;
	width: 100%;
	min-height: 25vh;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
}

.link-item:hover {
	text-decoration: none;
}

.link-item .image-wrapper {
	position: absolute;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	left: 0;
}

.link-item .image-wrapper::after {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.1);
	position: absolute;
	bottom: 0;
	transition: all .3s ease;
}

.link-item .image-wrapper.no-overlay::after {
	background-color: transparent;
}

a.link-item:hover .image-wrapper::after {
	background-color: rgba(0, 0, 0, 0.4);
	transition: all .3s ease;
}

a.link-item.bg-beige:hover {
	background-color: #b99074;
	transition: all .3s ease;
}

.link-item .text-box {
	flex-direction: column;
	padding: 10rem;
	justify-content: center;
	align-items: center;
	max-width: 90rem;
}

.link-item .text-wrapper {
	padding: 3rem;
	margin: 0;
}

@media only screen and (min-width: 320px) {
	.link-item.sm-w-50 {
		width: 50%;
	}
}

@media only screen and (min-width: 1001px) {

	.link-item {
		min-height: calc(50vh - 4rem);
	}

	.link-item.md-w-25 {
		width: 25%;
	}

	.link-item.md-w-33 {
		width: 33.33%;
	}

	.link-item.md-w-40 {
		width: 40%;
	}

	.link-item.md-w-50 {
		width: 50%;
	}

	.link-item.md-w-60 {
		width: 60%;
	}
}

@media only screen and (max-width: 1500px) {
	.link-item .text-box {
		padding: 10rem 5rem 5rem;
	}
}

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

	.topsection .section-block {
		margin-top: 6rem;
	}

	.link-item .text-box {
		padding: 10rem 2rem 5rem;
	}

	.link-item .text-wrapper {
		padding: 2rem;
	}
}

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

	.link-item .text-wrapper {
		padding: 1rem;
	}
}

/* Top-section / Hero section
========================================================================== */
.LayoutPage .hero-section {
	background-color: transparent;
	margin-top: 8rem;
}

.hero-block {
	/*display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 2rem;*/
	min-height: calc(70vh - 8rem);
	/*background-color: rgba(0, 0, 0, .4);*/
	padding: 2rem;
}

/*.hero-block .text-block:nth-child(1) {
	align-self: flex-end;
	justify-self: flex-end;
}*/
.hero-block .text-block {
	margin: auto;
	margin-top: 15rem;
	text-align: center;
}
.hero-block .text-block {
	max-width: 70rem;
}
.hero-block h1 {
	text-align: start !important;
	font-size: 5rem !important;
	font-weight: 300 !important;
}
.hero-block .btn-wrapper {
	text-align: end;
}
.hero-block .text-block:nth-child(2) {
	grid-area: 2 / 2 / 2 / 2;
	align-self: flex-start;
	justify-self: flex-start;
}

.hero-block .section-title {
	font-size: 8rem;
}

.hero-block p {
	font-size: 2rem;
	max-width: 45rem;
}




.hero-3 .section-block {
    display: flex;
    align-items: center;
    min-height: 30rem;
    /*background-color: rgb(var(--black-color), .5);*/
}

.hero-3 .section-block-wrapper {
    width: 100%;
}

.hero-3 .section-title {
    font-size: 6rem;
    color: rgb(var(--white-color));
}

@media only screen and (max-width: 580px) {
    .hero-3 .section-block {
        min-height: 30rem;
    }

    .hero-3 .section-title {
        font-size: 4rem;
    }
	.hero-block h1 {
		text-align: center !important;
		font-size: 4rem !important;
	}
	.hero-block .btn-wrapper {
		text-align: center;
	}
}

@media only screen and (max-width: 1000px) {
	.hero-block {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}

	.hero-block .section-title {
		font-size: 5rem;
	}

	.hero-block .text-block:nth-child(2) {
		margin: 0 0 0 auto;
	}
}

/* Sektion Tjanster/kontor (.section-offices)
========================================================================== */
.locations .card-item:nth-child(1),
.locations .card-item:nth-child(2),
.locations .card-item:nth-child(4) {
	background-color: #202020;
}

.locations .card-item {
	width: calc((100% / 4) - 1rem);
	margin: 0 0 2rem;
}

@media only screen and (max-width: 900px) {
	.locations .card-item {
		width: 100%;
	}
}

/* Sektion Galleri (.section-gallery) 
====================================================================  */

.section-gallery .section-block {
	padding: 0rem 5rem 8rem;
}

.section-gallery .col-wrapper {
	background-color: #c9d6c6;
	padding: 5rem 3rem;
	border-radius: 2px;
}

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

@media only screen and (max-width: 1000px) {
	.section-gallery .section-block {
		padding: 0;
	}

	.section-gallery .col-wrapper {
		border-radius: 0;
	}
}

@media only screen and (max-width: 550px) {
	.section-gallery .section-block {
		padding: 0;
	}

	.section-gallery .col-wrapper {
		border-radius: 0;
		padding: 5rem 2rem;
	}

	.project-wrapper {
		margin-top: 0;
	}

}


/* Sektion Call to action (.section-cta)
========================================================================== */

.section-cta .section-block,
.SubPage .section-cta .section-block {
	padding-top: 5rem;
	padding-bottom: 0;
	z-index: 1;
	position: relative;
}

.cta-wrapper {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width: 100%;
	padding: 4rem 0;
	text-align: left;
	border-bottom: 1px solid #F2F2F2;
}

.cta-content {
	max-width: none;
}

/* .cta-wrapper .btn-wrapper {
	align-self: center;
	margin: 0;
} */

.cta-title {
	padding-bottom: 1rem;
}

.cta-wrapper a:not(.btn):hover {
	color: #fff;
}

/* Cards */
.cta-contacts {
	justify-content: flex-start;
}

.cta-contacts .card-item {
	min-width: 22rem;
	width: auto;
	margin: 0 1rem 3rem 0;
}

@media only screen and (max-width: 1000px) {
	.cta-wrapper {
		flex-wrap: wrap;
	}

	.cta-content {
		padding: 0;
	}
}

@media only screen and (max-width: 768px) {
	.cta-wrapper {
		padding: 3rem 0;
	}

	.cta-content {
		width: 100%;
	}
}

/* ==========================================================================
Startsida
========================================================================== */
.section-intro .col-1{
	background-color: rgb(191, 160, 155);
	padding-top: 10rem;
	padding-bottom: 10rem;
}
.section-intro  .text-block-wide{
	padding-left: 4rem;
}
@media only screen and (max-width: 600px) {
	.section-intro .col-0{
	display: none;
		}
	.section-intro .col-1{
	width: 100% !important;
	padding: 4rem;
	}

}
/* ==========================================================================
Undersidor - galler alla undersidor
========================================================================== */

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


/* Heros
========================================================================== */

/* Gemensamt */
.hero {
	padding-top: 10rem !important;
}

.hero .section-block-wrapper {
	max-width: none;
}

.LayoutPage .hero .section-block {
	padding: 0;
}

.hero-1 .split-grid {
	display: flex;
	width: 50%;
}

@media only screen and (max-width: 1000px) {
	.hero-1 .split-content {
		padding: 2rem 2rem 5rem;
	}
}

@media only screen and (max-width: 580px) {
	.hero-1 h1 {
		font-size: 3rem;
	}
}

/* Hero 2 */
.SubPage .LayoutPage .hero-2 .section-block {
	padding-bottom: 4rem;
}

.hero-2 h1 {
	border-top: 2px solid rgb(68, 68, 68);
	padding-top: 3rem;
}

/* ==========================================================================
Undersidor > Tjanster
========================================================================== */

/* Sektion Hero
========================================================================== */
.hero-service.bygg {
	background-image: url(/assets/images/projektledning-2000.jpg);
	background-position: center 70%;
}

.hero-service.vvs {
	background-image: url(/assets/images/forstudie-1000.jpg);
	background-position: center center;
}

.hero-service.ledning {
	background-image: url(/assets/images/hero/collage-4-2000px.jpg);
	background-position: center center;
	background-position: cover;
}

.hero-service.el {
	background-image: url(/assets/images/el-b-2000px.jpg);
}

.hero-service.ljusdesign {
	background-image: url(/assets/images/ljusdesign-b-2000px.jpg);
	background-position: center center;
	background-position: cover;
}

.hero-service.installation{
	background-image: url(/assets/images/installation-b-2000px.jpg);
	background-position: center center;
}

.hero-service.energi{
	background-image: url(/assets/images/energi-b-2000px.jpg);
	background-position: center center;
}
.hero-service.vvs-kyla{
	background-image: url(/assets/images/vvs-kyla-b.jpg);
	background-position: center center;
}



.hero-service {
	background-size: cover;
}

.hero-service h1{
	margin-top: 6rem;
}


.pt-0,
.LayoutPage .pt-0 .section-block {
	padding-top: 0;
}

.hero-box {
	position: relative;
	z-index: 1;
	top: -5rem;
	width: 100%;
	max-width: 100rem;
	margin: 0 auto;
	padding: 8rem 5rem;
	background-color: hsl(0, 0%, 15%);
	border-radius: 3px;
	text-align: center;
}

.hero-box h1 {
	border-top: 1px solid #fff;
	padding-top: 3rem;
}

.hero-box .ingress {
	text-align: center;
}

@media only screen and (max-width: 580px) {
	.hero-service {
		min-height: 30rem;
	}

	.hero-box {
		padding: 5rem 2rem 1rem;
		top: -3rem;
	}
}

/* Sektion Tjanster
========================================================================== */

.section-services .icon-cards{
	display: flex;
	max-height: 10rem; 
}

.section-services .small-title {
	padding-top: 2rem;
	padding-bottom: 0;
	margin-bottom: 0;
}

.section-services .services-startpage .small-title {
	padding-bottom: 2rem;
}

.section-services .icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 6rem;
	height: 6rem;
	padding: 2rem;
	margin-bottom: 0rem;
	text-align: left;
	border-radius: 1rem;
	border: 2px solid #000000;
	margin-right: 2rem;
}

.section-services  i {
	color: #000000;
	font-size: 3.5rem;
}

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

	.services .card-item:nth-child(2){
		width: calc(70% - 1rem);
	}
	.services .card-item:nth-child(1){
		width: calc(30% - 1rem);
	}
	.services .card-item:nth-child(3){
		width: calc(40% - 1rem);
	}
	.services .card-item:nth-child(4){
		width: calc(60% - 1rem);
	}
}

@media only screen and (max-width: 1300px) {
	.section-services .col-0,
	.section-services .col-1{
		width: 100% !important;
		padding-bottom: 2rem;
	}
}
@media only screen and (max-width: 500px) {
	.section-services .installation{
		padding-top: 1rem;
	}
}
@media only screen and (max-width: 420px) {
	.section-services .small-title{
		padding-top: 1rem;
		font-size: 1.5rem;
	}

}

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

	.services .card-item:nth-child(1),
	.services .card-item:nth-child(4) {
		width: calc(40% - 1rem);
	}

	.services .card-item:nth-child(2),
	.services .card-item:nth-child(3) {
		width: calc(60% - 1rem);
	}
}*/


.section-var-roll .card-item {
  background: white;
  border-radius: 12px;
  padding: 1rem;
}

.section-var-roll .card-body {
  padding: 2rem;
  text-align: center;
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
		 display: flex; 
  flex-direction: column;
}

.split-card {
  margin-bottom: 2rem;
  font-size: 1rem;
  line-height: 1.6;
  color: #333;
}

.var-roll-wrapper {
  background: #e7e2db;
  border-radius: 10px;
  padding: 1.5rem;
  text-align: left;
    flex-grow: 1; 
	text-align: center;
}

.var-roll-title h3 {
  margin-top: 0;
  font-size: 1.2rem;
  color: #2e2e2e;
}

.var-roll-text {
  padding-top: 1rem;
}

.var-roll-text p {
  margin: 0.5rem 0;
}
.arrow-wrapper{
	margin-bottom: 4rem;
	margin-top: 4rem;
}
.arrow-wrapper i {
	font-size: 8rem;
}

/* ==========================================================================
Undersida > Kontor 
========================================================================== */

/* Office Split
========================================================================== */

.location-split {
	margin-top: 3rem;
	border-radius: 2px;
	overflow: hidden;
}

.location-split .split-content {
	padding: 10rem;
	background-color: rgb(219, 213, 205);
}

.location-split .split-map {
	background-color: rgb(219, 213, 205);
	width: 50%;
}

.map-container {
	position: relative;
	width: 100%;
	max-width: 40rem;
	margin: 0 auto;
}

.map-pin {
	position: absolute;
	font-size: 0;
}

.map-pin::before {
	position: absolute;
	width: 2rem;
	height: 2rem;
	content: '';
	background-color: #E37173;
	border-radius: 50%;
	box-shadow: 0 0 0 0 #E37173;
}

.map-pin::after {
	position: relative;
	content: attr(data-location);
	font-size: 1.4rem;
	left: 3rem;
	opacity: 0;
	transition: all .2s ease;
}

.map-pin.active-pin::before {
	animation: pulsing 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
}

.map-pin:hover::after,
.map-pin.active-pin::after {
	opacity: 1;
	transition: all .2s ease;
}

.map-pin.sthlm {
	left: 74%;
	top: 29%;
}

.map-pin.krlstd {
	left: 36%;
	top: 29%;
}

.map-pin.jkpg {
	left: 39%;
	top: 55%;
}

.map-pin.flknbrg {
	left: 25%;
	top: 70%;
}

@keyframes pulsing {
	to {
		box-shadow: 0 0 0 30px rgba(232, 76, 61, 0);
	}
}

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

@media only screen and (max-width: 1000px) {
	.location-split .split-content {
		padding: 5rem 3rem;
	}

	.location-split .split-map {
		width: 100%;
		padding-bottom: 3rem;
	}
}

@media only screen and (max-width: 550px) {
	.location-split .split-content {
		padding: 5rem 2rem;
	}

}

/* Expanding btns */
.expanding-btns.btn-wrapper {
	width: 100%;
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
}

.expanding-btns .btn {
	margin: .5rem 0;
	max-width: none;
}

/* ==========================================================================
Undersida > Kontor > Enskilda Kontor
========================================================================== */
.sub-office .hero-2 .section-block {
	background-color: rgb(219, 213, 205);
	padding: 20rem 3rem 0;
}

.inner-wrapper {
	background-color: #fff;
	padding: 3rem;
	margin: 0 auto;
	position: relative;
	bottom: -3rem;
	border-radius: 2px;
}

.hero-2 h1>* {
	display: block;
	text-align: center;
}

.map {
	font-size: 0;
}

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

	.sub-office .LayoutPage .hero-2 .section-block {
		padding: 15rem 2rem 10rem;
	}

	.map iframe {
		height: 35rem;
	}

	.inner-wrapper {
		padding: 3rem 1rem;
		bottom: 0;
	}

}

/* ==========================================================================
Undersida: Personal
========================================================================== */

/* Sektion Medarbetare
========================================================================== */

/* Tabbval */
.tabs-wrapper {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 2rem;
	align-items: baseline;
}

.tabs-wrapper>div {
	width: calc(100% / 3);
}

.tabs-wrapper .btn-wrapper {
	margin: 0;
}

.tabs-wrapper .tabs-list {
	display: flex;
	justify-content: flex-start;
}

.tabs-wrapper .input-wrapper {
	display: flex;
	justify-content: flex-end;
}

.tabs-heading {
	display: none;
}

.tab {
	-webkit-appearance: none;
	appearance: none;
	display: inline-block;
	padding: 1rem 2rem;
	color: #7c7c7c;
	font-size: 1.6rem;
	font-weight: 400;
	font-family: inherit;
	cursor: pointer;
	background-color: transparent;
	border: none;
	border-radius: 2px;
}

.tab:hover {
	background-color: #F2F2F2;
}

.tab-active {
	color: #111;
}

.tab-input,
.search-input {
	width: 75%;
	max-width: 34rem;
	margin: 0 0 0 auto;
	height: 3rem;
	border: none;
	font-size: 1.6rem;
	font-family: inherit;
	padding: 0 0 0 2.7rem;
	background: url(/assets/images/search.svg) left 45% no-repeat;
	background-size: 2rem;
}

/* DROP DOWN BUTTON */
.dropdown {
	position: relative;
	display: inline-block;
	cursor: pointer;
	-moz-transition: 0.2s ease-in-out;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}

.dropbtn {
	cursor: default;
	padding: 1rem 5rem;
}

.dropbtn::after {
	content: '\f078';
	font-family: 'Font Awesome 5 Pro';
}

.dropdown:hover .dropbtn::after {
	transform: rotate(-180deg);
}

.dropdown-content {
	display: none;
	position: absolute;
	background-color: #fff;
	width: 100%;
	min-width: 15rem;
	text-align: left;
	box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.1);
	z-index: 1;
	border-radius: 1rem;
	overflow: hidden;
	-moz-transition: 0.2s ease-in-out;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}

.dropdown-content.ledning {
	top: 4rem;
}

.dropdown-content .tag {
	color: #444;
	padding: 1rem 2rem;
	text-decoration: none;
	display: block;
	font-size: 1.4rem;
}

.dropdown-content .tag:hover {
	color: #e98119;
	text-decoration: none;
}

.dropdown-content .tag.clicked {
	position: relative;
}

.dropdown-content .tag.clicked::after {
	content: '\f00c';
	font-family: 'Font Awesome 5 Pro';
	font-weight: 400;
	line-height: 2rem;
	float: right;
}

.dropdown:hover .dropdown-content {
	display: block;
}

@media only screen and (max-width: 480px) {
	.dropbtn {
		padding: .6rem 1rem;
	}
}

/* Wrapper for medarbetare */
.tab-active-wrapper.no-result::after {
	content: 'Ingen matchning tyvärr';
	position: relative;
	display: block;
	margin: 0 auto;
	padding: 5rem 0;
	font-size: 2rem;
}

/* Cards */
.team-wrapper.cards-wrapper {
	justify-content: flex-start;
}

.team-wrapper.cards-wrapper .card-item {
	width: calc(100% / 4 - 1rem);
	margin: 0 .5rem 1rem;
	border-radius: 2px;
}

.image-view.cards-11 .text-wrapper {
	position: absolute;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-start;
	padding: 1.5rem;
	top: 0;
	left: 0;
	background-color: rgba(255, 255, 255, .8);
	visibility: hidden;
	opacity: 0;
	transition: all .2s ease;
	border-radius: 2px;
}

.image-view.cards-11 .text-wrapper.list-style {
	position: static;
	visibility: visible;
	justify-content: flex-start;
	opacity: 1;
}

.image-view.cards-11 .card-item:hover .text-wrapper {
	visibility: visible;
	opacity: 1;
	transition: all .2s ease;
}

.section-employees .hidden-item-tag {
	display: none;
}

@media only screen and (max-width: 1300px) {
	.team-wrapper.cards-wrapper .card-item {
		width: calc((100% / 3) - 1rem);
	}
}

@media only screen and (max-width: 1370px) {
	.tabs-wrapper>div {
		order: 0;
		flex: none;
	}

	.tabs-wrapper .btn-wrapper {
		display: flex;
		width: 100%;
		order: 1;
		margin: 2rem 0 0;
	}

	.tabs-wrapper .dropdown {
		margin-right: .5rem;
	}
}

@media only screen and (max-width: 900px) {
	/* Cards */
	.team-wrapper.cards-wrapper .card-item {
		width: calc((100% / 2) - 1rem);
	}

	/* Tabs Wrapper */
	.tabs-wrapper .tabs-list {
		width: 100%;
	}

	.tab-input {
		width: 100%;
		margin: 2rem 0 0;
	}

	.tab-input,
	.search-input {
		width: 100%;
		margin: 0;
	}

	.tabs-list {
		margin-bottom: 2rem;
	}

	.tabs-list button {
		background-color: #7c7c7c;
		border-radius: 1rem;
		margin-right: .5rem;
		color: #fff;
	}
}

@media only screen and (max-width: 600px) {
	.team-wrapper.cards-wrapper .card-item {
		width: 100%;
		margin: 0 0 2rem;
	}
}

@media only screen and (max-width: 480px) {
	.tabs-wrapper .btn-wrapper {
		margin-top: 0;
	}

	.tabs-wrapper button {
		padding: .5rem 1rem; 
	}
}

/* ==========================================================================
Undersida: Projekt
========================================================================== */
.section-projects .sub-title {
	font-size: 2.3rem;
}

.section-projects .cards-wrapper {
	justify-content: flex-start;
}

.section-projects .card-item {
	margin: .5rem;
}

.photo-text{
	position: absolute;
    bottom: 0;
    color: black;
    background: white;
	width: 100%;
	text-align: center;
}


@media only screen and (max-width: 1200px) {
	.section-projects .cards-wrapper.w-25 .card-item {
		width: calc((100% / 2) - 1rem);
		margin: .5rem;
	}
}

@media only screen and (max-width: 700px) {
	.section-projects .cards-wrapper.w-25 .card-item {
		width: 100%;
		margin: 1rem 0;
	}
}

/* ==========================================================================
Undersida: Projekt > Enskilt projekt
========================================================================== */
@media only screen and (max-width: 1000px) {
	.section-project .split-wrapper {
		flex-direction: column-reverse;
	}
}

/* ==========================================================================
Undersida: Tjänster
========================================================================== */
.services-wrapper .service-item:first-child {
	width: calc(100% - 30rem);
}

.services-wrapper .service-item:nth-child(2) {
	width: 30rem;
}

.cards-wrapper .service-item.align-center {
    align-self: center;
}
.section-service-tripple .pl-1{
	padding-left: 1rem !important;
}
.section-service-tripple .pr-1{
	padding-right: 1rem !important;
}

.section-service-tripple .pl-4{
	padding-left: 4rem !important;
}
.section-service-tripple .p-4{
	padding: 8rem;
}

.section-service-tripple .col-0{
width: 45% !important;

}
.section-service-tripple .col-1{
	width: 30% !important;
	}
	.section-service-tripple .col-2{
		width: 25% !important;
		background: white !important;
		}

/*  Tjanster Farger */
.bg-ljusdesign{
	background: rgb(191, 197, 197) !important;
}

.bg-el{
	background: rgb(219, 213, 205) !important;
}
.bg-vvs{
	background: rgb(205, 217, 215) !important;
}
.bg-install{
	background: rgb(216, 190, 175) !important;
}

.bg-energi{
	background: rgb(175, 178, 185) !important;
}
.bg-peach{
	background-color: rgb(191, 160, 155);
}
.bg-white{
	background-color: white;
}

@media only screen and (max-width: 1200px) {
		.section-service-tripple .col-1{
			width: 50% !important;
			}
			.section-service-tripple .col-2{
				width: 100% !important;
				background: white !important;
				}
				.section-service-tripple .pl-1{
					padding-left: 4rem !important;
				}
				.section-service-tripple .pr-1{
					padding-right: 4rem !important;
				}
}


@media only screen and (max-width: 1050px) {
	.services-wrapper .service-item {
		width: 100% !important
	}
	.section-service-tripple .p-8{
		padding-left: 4rem;
	}
}

@media only screen and (max-width: 960px) {
	.section-service-tripple .p-4{
		padding-bottom: 2rem !important;
		padding: 2rem !important;
	}
	.section-service-tripple .col-0{
		width: 100% !important;
		
		}
		.section-service-tripple .col-1{
			width: 100% !important;
			}
			.section-service-tripple .col-2{
				width: 100% !important;
				background: white !important;
				}
}


/* ==========================================================================
Tjanster utkast
========================================================================== */

.section-process .w-100{
	width: 100% !important;
	margin-top: 2rem !important;
	margin-bottom: 2rem;
}
.section-process .js-more-text{
	margin-top: 3rem;
}
/* ==========================================================================
Undersida Jobba hos oss
========================================================================== */
.section-job .image-wrapper h2{
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
    width: 100%;
    font-size: 1.5em;
    color: #fff;
}
.section-job .image-wrapper {
	position: relative;
	text-align: center;
  }

  .section-job .card-3-1 .image-wrapper {
    height: 17rem;
}

/* ==========================================================================
Footer
========================================================================== */
/*.footer {
	background-color: #111;
	padding: 0;
	color: #ccc;
	z-index: 1;
	position: relative;
}*/

.footer {
	background-color: rgb(219, 213, 205);
	padding: 0;
	color: #000000;
	z-index: 1;
	position: relative;
}

.footer .container {
	padding: 10rem 5rem 0;
	max-width: 160rem;
}

.footer p,
.footer a {
	text-align: left;
	font-size: 1.4rem;
	color: inherit;
}

.footer a:hover {
	color: #FFF;
	text-decoration: underline;
}

.footer-container {
	display: flex;
	flex-direction: column;
	padding: 0;
	position: relative;
}

/* FOOTER MENU */

.footer-nav {
	width: 100%;
	margin-bottom: 5rem;
}

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

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

p.footer-heading {
	font-family: inherit;
	font-size: 1.4rem;
	text-transform: uppercase;
	font-weight: 500;
	letter-spacing: .1em;
	color: #e98119;
	padding-bottom: 1em;
}

/* FOOTER SUBMENU */

.footer-submenu {
	padding-inline-start: 0;
	list-style-type: none;
	margin-bottom: 5rem;
}

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

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

.sigill-wrapper img{
	max-width: 7rem;
	padding-right: 1rem;
}

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

.footer .social {
	display: flex;
	align-items: center;
	justify-content: center;

	font-size: 0;

	width: 4rem;
	height: 4rem;
	margin-right: 1.2rem;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 2rem;
	background-color: #ffffff;
	color: #111;
}

.footer .social:hover {
	background-color: #FFF;
	border-color: #FFF;
	color: #111;
	text-decoration: none;
}

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

	position: relative;
	top: 1px;
}

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

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

/* Footer Bottom */

.footer-bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	border-top: 1px solid #ccc;
	width: 100%;
	padding: 2rem 0;
}

.footer-bottom p {
	font-size: 1.2rem;
}

/* WebbEss Stamp  */
.footer .webbess-stamp {
	display: flex;
	align-items: center;
	padding: 0;
	font-size: 1.2rem;
	font-weight: normal;
}

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

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

	.footer .container {
		padding: 12rem 3rem 0;
	}

	.footer-container {
		flex-wrap: wrap;
	}

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

	.footer-menu {
		width: 25%;
	}

}

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

	.footer-menu {
		width: 50%;
	}

}

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

	.footer .container {
		padding: 0 2rem;
		padding-top: 6rem;
	}

	.footer-menu {
		width: 100%;
	}

	.footer .footer-bottom {
		padding-left: 0;
	}

}



