/* Greenline Sweden */
@import url("https://use.typekit.net/cnx1rzn.css");

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

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

#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%);
}

:root {
	/* Farger */

	--primary: #21b2c5;
	--primary-light:#e9f9fb;
	--primary-green: #96c33c;
	--primary-green-light:#eaf3d8;
}

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

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

html {
	font-size: 62.5%;
}

body {
	background-position: center center;
	font-family: proxima-nova, sans-serif;
}

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

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

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

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

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

.LayoutPage .pb-0 .section-block,
.SubPage .LayoutPage .pb-0 .section-block,
.pb-0 {
	padding-bottom: 0;
}
.mt-0{
	margin-top: 0 !important;
}

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

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

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

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

.intro-section .section-block-wrapper {
	max-width: 70rem
}

.section-wrapper {
	padding: 0;
}

.display-none {
	display: none;
}

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

/* Paddings */
.p-2 .section-block,
.p-2:not(.section-wrapper) {
    padding: 2rem;
}

/* Specifika margins */
.mt-3 {
	margin-top: 3rem !important;
}

.mt-5 {
	margin-top: 5rem !important;
}
.mx-1{
margin-left: 1rem;
margin-right: 1rem;
}

/* Knappar
========================================================================== */

.btn {
	max-width: 50rem;
	width: auto;
	box-sizing: border-box;
	padding: 1.6rem 5rem;
	border-radius: 4rem;
	text-align: center;
	text-transform: uppercase;
	font-weight: 400;
	font-size: 1.4rem;
	letter-spacing: 3px;
	line-height: 1em;
	-webkit-transition: all .4s ease;
	transition: all .4s ease;
	display: inline-block;
}

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

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

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

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

.btn-secondary,
.btn-secondary:hover {
	background-color: #f1f8ff;
	border-color: #f1f8ff;
	color: #111;
}

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


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

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

/* Button with arrow */

.btn.arrow span {
	display: inline-block;
	transform: translateX(-8px);
	transition: all .3s ease;
}

.btn.arrow:hover span {
	transform: translateX(8px);
	transition: all .3s ease;
}

.btn.arrow::before,
.btn.arrow::after {
	position: relative;
	display: inline-block;
}

.btn.arrow::before {
	font-family: 'Font Awesome 5 Pro';
	font-weight: 900;
	content: '\f0da';
	transform: translateX(-30px);
	opacity: 0;
	transition: all .5s ease;
}

.btn.arrow::after {
	font-family: 'Font Awesome 5 Pro';
	font-weight: 900;
	content: '\f0da';
	transform: translateX(8px);
	opacity: 1;
	transition: all .5s ease;
}

.btn.arrow:hover::before {
	transform: translateX(-8px);
	opacity: 1;
	transition: all .5s ease;

}

.btn.arrow:hover::after {
	transform: translateX(30px);
	opacity: 0;
	transition: all .5s ease;
}

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

@media only screen and (hover: none) {
	.btn::after {
		display: none;
	}
}


/* Farger
========================================================================== */

.primary-color {
	color: #96c33c;
}

.bg-lightgray .section-block {
	background-color: #f9f9f9;
}

.text-white {
	color: #FFF;
}

.text-red {
	color: red;
}

/* Split-wrapper
========================================================================== */

.split-section .normaltext-type {
	max-width: none;
}

.split-wrapper {
	display: flex;
	position: relative;
	flex-wrap: wrap;
}

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

.split-content {
	width: 50%;
	text-align: left;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 9rem;
}

.split-content-p4 {

	padding: 4rem !important;
}



.split-content h3 {
	margin: 0;
	margin-bottom: 3rem;
}

.split-text {
	padding: 14rem 9rem;
}

.split-content.bg-dark {
	background-color: #96c33c;
}

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

.split-image {
	width: 50%;
	position: relative;
	overflow: hidden;
	height: auto;
	border-radius: 3px;
}
/* Centrera content */
.split-wrapper .align-center {
    align-self: center;
}
.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;
	transition: all .8s ease;
}

.split-image:hover img {
	transform: scale(1.05);
	transition: all .8s ease;
}

@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;
	}
}

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

	.split-content,
	.split-image {
		width: 100%;
	}

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


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

/* Text och typsnitt
========================================================================== */
p {
	line-height: 1.8;
	font-size: 1.4rem;
	color: #444;
	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;
}

p a {
	text-decoration: underline;
	color: inherit;
	text-decoration-color: #96c33c;
	position: relative;
	z-index: 0;
}

p a::after {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	bottom: 0px;
	background-color: #96c33c;
	z-index: -1;
	opacity: 0;
	transform-origin: bottom;
	transition: all .1s ease;
}

p a:hover::after {
	opacity: .3;
	background-color: #96c33c;
	transform-origin: bottom;
	transition: all .1s ease;
}

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

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: proxima-nova, sans-serif;
	font-weight: 700;
	letter-spacing: 0px;
	line-height: 1.15;
	color: #111;
}


h1 {
	font-size: 5rem;
	letter-spacing: 1px;
}

h2 {
	font-size: 4rem;
	letter-spacing: 1px;
}

h3 {
	font-size: 3rem;
}

h4 {
	font-size: 2.5rem;
}


.lead {
	font-size: 1.25em;
}

.text-label {
	font-size: 1.6rem;
	padding-bottom: 2rem;
	line-height: 100%;
	font-weight: 400;
	color: #96c33c;
	opacity: 1;
	letter-spacing: 0.25em;
	word-spacing: 0.25em;
	font-family: proxima-nova, sans-serif;
	text-transform: uppercase;
}

.section-title {
	font-size: 2rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	word-spacing: .1em;
	padding: 0 0 .5em 0;
}

.section-title-big {
	font-size: 4rem !important;
	text-transform: uppercase;
	letter-spacing: .1em;
	word-spacing: .1em;
	padding: 0 0 .5em 0;
}

.text-block {
	max-width: 98rem;
}
.text-block-center {
	max-width: 80rem;
	margin: auto !important;
	text-align: center;
}

.f-4{
	font-size: 4rem !important;
}

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

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

.heading-type h5 {
	text-align: center;
}


/* Övriga klasser */
.bolder,
.text-bold {
	font-weight: 700;
}

.nowrap {
	white-space: nowrap;
}

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

@media only screen and (max-width: 1024px) {
	h1 {
		font-size: 3.5rem;
	}

	h2 {
		font-size: 3rem;
	}

	h3 {
		font-size: 2.5rem;
	}

	h4 {
		font-size: 2rem;
	}

	.lead {
		font-size: 1.125em;
	}
}

/* Styled list
========================================================================== */

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

.styled-list.row-list {
	flex-direction: row;
}

.styled-list li {
	position: relative;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1em;
}

.styled-list li::before {
	position: absolute;
	content: '\f00c';
	display: flex;
	justify-content: center;
	align-items: center;
	top: 2px;
	left: -4rem;
	width: 2rem;
	height: 2rem;
	border-radius: 3rem;
	font-family: 'Font Awesome 5 Pro';
	font-weight: 300;
	font-size: 1rem;
	color: #96c33c;
	background-color: #eaf3d8;
}

/* Popup-notis
========================================================================== */
.EditMode .popup-wrapper {
    display: none;
}

.popup-wrapper {
    z-index: 8;
    position: fixed;
    bottom: 3rem;
    right: 3rem;
}

/* Knappar */
.popup-button {
    position: relative;
    width: 5rem;
    height: 5rem;
    background: #96c33c;
    border-radius: 50%;
    box-shadow: 0 0 3rem rgba(15, 36, 47, .3);
    cursor: pointer;
}
 
.popup-button i {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 2.8rem;
    transform: translate(-50%,-50%);
    transition: .3s ease;
}

.popup-wrapper .popup-button .icon-open,
.popup-wrapper.opened .popup-button .icon-close {
    transform: translate(-50%,-50%) scale(1);
}

.popup-wrapper.opened .popup-button .icon-open,
.popup-wrapper .popup-button .icon-close {
    transform: translate(-50%,-50%) scale(0);
}

/* Innehåll */
.popup-window {
    opacity: 0;
    visibility: hidden;
    position: fixed;
    right: 0;
    bottom: 6rem;
    max-width: 45rem;
    max-height: calc(100vh - 12rem); 
    padding: 4rem;
    margin: 0 2rem;
    background: #FFF;
    border-radius: 2rem;
    box-shadow: 0 0 3rem rgba(15, 36, 47, .3);
    overflow: auto;
    transition: opacity .3s ease, bottom .3s ease;
}

.popup-wrapper.opened .popup-window {
    opacity: 1;
    visibility: visible;
    display: block;
    bottom: 10rem;
}

.icon-close-popup {
    position: absolute;
    top: 2rem;
    right: 2rem;
    font-size: 2.5rem;
    cursor: pointer;
}

.popup-wrapper .small-title {
	font-size: 2.3rem;
}

.popup-wrapper .btn-wrapper {
	margin-top: 2rem;
}

@media only screen and (max-width: 450px) {
    .popup-window {
        padding: 2rem 3rem 2rem 2rem;
    }

    .icon-close-popup {
        top: 1rem;
    }
}


/* ==========================================================================
Header / Navigation
========================================================================== */
/* Header / Navigation
========================================================================== */
/* Top header */
.top-header {
    display: flex;
    align-items: center;
    width: 100%;
    height: 5rem;
  	background: #96c33c;
    overflow: hidden;
}

.top-header p {
    width: 100%;
    padding: 0;
    font-size: 2.4rem;
}

/* Marquee */
.marquee {
    z-index: 1;
    position: relative;
    white-space: nowrap;
    animation: marquee 40s linear infinite;
}


@keyframes marquee {
    0% {
        transform: translateX(100%);
    }

    100% {
        transform: translateX(-100%);
    }
}

@media only screen and (max-width: 1024px) {
    .marquee {
        animation: marquee 50s linear infinite;
    }
}

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

header.scrolled {
	box-shadow: 0 2rem 4rem rgba(0, 0, 0, 0.1);
	transition: all 500ms linear;
}

header .container {
	max-width: none;
	padding: 0 2rem;
	background-color: #FFF;
}

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

/* Media query for only showing scrolled effect above 981px */
@media only screen and (min-width: 981px) {
	header.scrolled {
		background-color: #FFF;
		box-shadow: 0 1rem 4rem rgba(0, 0, 0, .1);
		transition: all 300ms linear;
	}

	header.scrolled nav.mainmenu ul.TemplateMenu>li {
		line-height: 8rem;
		transition: all 300ms linear;
	}

	header.scrolled .header-logo {
		line-height: 8rem;
		transition: all 300ms linear;
	}

	header.scrolled nav.mainmenu a {
		line-height: 8rem;
		transition: all 300ms linear;
	}

}

/* HEADER LOGO */

header .header-logo {
	width: 19rem;
	padding: 0;
	line-height: 8rem;
	display: block;
	float: left;
	transition: all 500ms linear;
}


/* MAIN MENU */

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

nav.mainmenu {
	text-align: right;
}

nav.mainmenu a {
	font-family: inherit;
	font-weight: 400;
	font-size: 1.4rem;
	line-height: 8rem;
	color: #444;
	text-transform: uppercase;
	letter-spacing: .1em;
	padding: 0 1rem;
	transition: all 500ms linear;
}

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

nav.mainmenu li:hover a,
nav.mainmenu li.active a,
nav.mainmenu ul>li.expandable-li:hover>a {
	color: #96c33c;
	text-decoration: none;
}

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

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


/* -- Undermeny -- */

nav.mainmenu li:hover>ul {
	margin-top: -5px;
	background-color: #fff;
	width: 20rem;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

nav.mainmenu ul > li > ul {
	width: 20rem;
	min-width: unset;
	border-radius: 0 0 3px 3px;
	padding: 0 1rem 1rem;
}

nav.mainmenu ul>li>ul>li>a {
	color: #96c33c !important;
	line-height: 4.5rem !important;
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
	-webkit-transform: translate(0) !important;
	-ms-transform: translate(0) !important;
	transform: translate(0) !important;
}

nav.mainmenu ul>li>ul>li:hover,
nav.mainmenu ul>li>ul>li.active {
	background: #eaf3d8;
	border-radius: 1rem;
}


/* New styling to show boats */
nav.mainmenu ul.TemplateMenu>li {
	position: static;
}

ul.TemplateMenu > li:nth-child(2)>ul {
	position: absolute;
	width: 100vw;
	left: 0;
	flex-direction: row;
	flex-wrap: wrap;
	padding: 0 2rem 2rem;
	box-shadow: 0 5rem 5rem rgba(0, 0, 0, .1);
}

ul.TemplateMenu > li:nth-child(2)>ul li {
	position: relative;
	width: 20%;
	padding: 2rem;
	transition: all .2s ease;
}

nav.mainmenu ul>li:nth-child(2)>ul>li>a::before {
	content: '';
	position: relative;
	display: block;
	width: 100%;
	height: 10rem;
	background-image: url(/assets/images/greenline-boat-39-cutout.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: left bottom;
}


nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(2)>a::before {
	background-image: url(/assets/images/greenline-boat-40-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(3)>a::before {
	background-image: url(/assets/images/grenline-42.png);
	background-position: center;
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(4)>a::before {
	background-image: url(/assets/images/greenline-boat-45fly-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(5)>a::before {
	background-image: url(/assets/images/greenline-boat-45coupe-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(6)>a::before {
	background-image: url(/assets/images/greenline-boat-48fly-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(7)>a::before {
	background-image: url(/assets/images/greenline-boat-48coupe-cutout.png);
}
/*
nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(7)>a::before {
	background-image: url(/assets/images/greenline-boat-ocean65-cutout.png);
}*/

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(8)>a::before {
	background-image: url(/assets/images/greenline-boat-58-fly-cutout.png);
}


/*nav.mainmenu ul>li:nth-child(2)>ul>li>a::before {
	content: '';
	position: relative;
	display: block;
	width: 100%;
	height: 10rem;
	background-image: url(/assets/images/greenline-boat-33-cutout.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: left bottom;
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(1)>a::before {
	background-image: url(/assets/images/greenline-boat-33-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(2)>a::before {
	background-image: url(/assets/images/greenline-boat-39-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(3)>a::before {
	background-image: url(/assets/images/greenline-boat-40-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(4)>a::before {
	background-image: url(/assets/images/greenline-boat-45fly-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(5)>a::before {
	background-image: url(/assets/images/greenline-boat-45coupe-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(6)>a::before {
	background-image: url(/assets/images/greenline-boat-48fly-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(7)>a::before {
	background-image: url(/assets/images/greenline-boat-48coupe-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(8)>a::before {
	background-image: url(/assets/images/greenline-boat-ocean65-cutout.png);
}

nav.mainmenu ul>li:nth-child(2)>ul>li:nth-child(9)>a::before {
	background-image: url(/assets/images/greenline-boat-58-fly-cutout.png);
}*/

ul.TemplateMenu > li:nth-child(2)>ul li>a {
	position: relative;
	border-bottom: 1px solid #96c33c !important;
}

/* Hamburger */
@media only screen and (min-width: 1201px) {
	.hamburger {
		display: none;
	}
}

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

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

	.hamburger-inner {
		top: 50px;
	}

	header {
		height: 10rem;
		width: 100vw !important;
	}


	header .header-logo {
		line-height: 6rem;
		padding: 0;
		float: left;
		left: 0;
	}

	nav.mainmenu {
		display: none;
	    text-align: left;
	    border-bottom: none;
	    width: 100vw;
	    background-color: #fff;
	    position: fixed;
	    top: 0;
	    left: 0;
	    z-index: 10;
	    height: 100%;
    	overflow-y: scroll;
    	box-shadow: none;
	}

	nav.mainmenu .Padding {
		border-top: none !important;
		margin: 10rem 0;
	}

	nav.mainmenu li a {
		font-size: 1.4rem;
		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;
	}

	nav.mainmenu ul.TemplateMenu>li {
		position: relative;
		display: block;
	}

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

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

	.dropdown-arrow:before {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		width: 4rem;
		height: 4rem;
		border-radius: 50%;
		font-family: 'Font Awesome 5 Pro';
		font-weight: 700;
		font-size: 2rem;
		content: '\f0d7';
		color: #96c33c;
		background-color: #eaf3d8;
	}

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

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

	nav.mainmenu li.level-open {
		background: #fff;
	}

	nav.mainmenu ul>li>ul>li>a {
		padding: 0.5rem 1rem;
		width: 100% !important;
	}

	nav.mainmenu li.active a,
	nav.mainmenu li:hover a {
		transform: translateY(-0rem);
	}

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

	nav.mainmenu li>ul {
		-webkit-box-shadow: none;
		box-shadow: none;
	}

	nav.mainmenu li>ul {
		position: relative;
		padding: 0 1rem;
	}

	nav.mainmenu ul.TemplateMenu>li {
		position: relative;
	}

	/* Batmodeller */

	ul.TemplateMenu > li:nth-child(2)>ul li {
		display: inline-block;
		position: relative;
		width: 50%;
		padding: 2rem 1rem 1rem;
	}

	nav.mainmenu ul>li:nth-child(2)>ul>li>a::before {
		height: 5rem;
		background-size: auto 5rem;
		background-position: 1rem bottom;
	}

	ul.TemplateMenu > li:nth-child(2)>ul {
		position: relative;
	}

}

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

	nav.mainmenu ul>li>ul>li {
		width: 100%;
		padding: 2rem 1rem 1rem;
	}

	ul.TemplateMenu > li:nth-child(2)>ul li {
		padding: 2rem .5rem 1rem;
	}

	ul.TemplateMenu > li:nth-child(2)>ul li>a {
		padding: .5rem 0 0;
		overflow: hidden;
		text-overflow: ellipsis;
		letter-spacing: .5px;
	}
}


/* ==========================================================================
Top-section
========================================================================== */
.top-section {
	display: flex;
	justify-content: center;
	align-items: center;
	height: auto;
	min-height: 100vh;
	overflow: hidden;
	background-color: rgba(0, 0, 0, 0.45);
	border: 2rem solid #fff;
}

.page-title-wrap {
	position: relative;
	transform: none;
	left: auto;
	top: auto;
	max-width: 100rem;
	height: calc(100% - 3rem);
	width: calc(100% - 3rem);
	display: flex;
	padding: 10rem 2rem;
	justify-content: center;
	align-items: center;
}

.page-title-wrap * {
	color: #fff;
}

/* .page-title-wrap h1 {
	font-size: 1.5rem;
	text-transform: uppercase;
	letter-spacing: 0.25em;
	text-shadow: none;
	font-weight: 400;
	padding-bottom: 1rem;
} */

.page-title-wrap img {
	max-width: 31rem;
}

.page-title-wrap h1 {
	font-size: 5rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	word-spacing: 0.1em;
	text-shadow: none;
	font-weight: 700;
}

.page-title-wrap h1::before,
.page-title-wrap h1::after {
	content: "";
	display: block;
	height: 0.1rem;
	width: 30rem;
	background: #fff;
	margin: 3rem auto;
	animation-name: appear;
	animation-duration: 3s;
}

.page-title-wrap h3 {
	font-size: 1.4rem;
	text-transform: uppercase;
	letter-spacing: 0.25em;
	text-shadow: none;
}

.page-title-wrap p {
	color: #fff;
	margin-top: 2rem;
	word-spacing: 0.25em;
}

.page-title-wrap .btn {
	margin-top: 4rem;

}

@media only screen and (max-width: 800px) {
	.page-title-wrap {
		padding: 15rem 2rem 10rem;
	}

	.page-title-wrap h1 {
		font-size: 5rem;
	}

	.page-title-wrap h1::before {
		margin-bottom: 2rem;
	}

	.page-title-wrap h1::after {
		margin-top: 2rem;
	}
}

@media only screen and (max-width: 550px) {
	.top-section {
		border: none;
	}

	.page-title-wrap h1 {
		font-size: 3rem;
	}

	.page-title-wrap img {
		max-width: 25rem;
	}
}

/* Popup */ 
#popupoverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0 , 0, 0.75);
    z-index: 1000;
}

#oppningPopup {
	display: none;
	position: fixed;
    top: 50%;
    left: 50%;
    width: 100%;
	/* max-width: 600px;
	max-height: 450px; */
	max-width: 75rem;
    max-height: auto;
    box-sizing: border-box;
	/* height: 90%; */
	overflow:auto;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
	z-index: 1010;
	background-color: #fff;
}

#oppningPopup .fal {
	color: #96c33c;
}

#oppningPopup .section-block {
	padding: 0rem;
	/* padding: 100px 40px; */
}

#oppningPopup .btn {
	box-shadow: none;
}

 #oppningPopup p {
	color: #000;
	 font-size: 1.8rem;
 }

#oppningPopupExit {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	font-size: 30px;
	color: #96c33c !important;
}

#oppningPopupExit:hover {
	cursor: pointer;
	color: #000 !important;
}

.EditMode #oppningPopup {
	display: block;
	position: static;
	transform: none;
	-webkit-transform: none;
	margin: 0 auto;
}

#oppningPopup .pop-up-item {
	display: flex;
}

#oppningPopup .pop-up-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 4rem;

}

@media only screen and (max-width: 414px) {
	#oppningPopup .button-circle {
  		padding: 1.2rem 1.1rem !important;
	}
}

/* Övriga klasser */
.hidden-items {
    display: none;
}

/* Modal som öppnas automatiskt
========================================================================== */
body:not(.EditMode) .section-auto-modal {
    display: none;
    z-index: 9;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
  }

  body:not(.EditMode) .section-auto-modal .section-block {
    position: fixed;
    top: 50%;
    left: 50%;
    width: calc(100% - 4rem);
    max-width: 75rem;
    max-height: 75vh;
    padding: 0rem;
    border-radius:0;
    overflow: auto;
    background: rgb(255, 255, 255);
    transform: translate(-50%,-50%);
  }

  .section-auto-modal .close-modal {
    position: absolute;
    top: 1rem;
    right: 2rem;
    font-size: 3rem;
    cursor: pointer;
  }

  /*.section-auto-modal .pop-up-item {
	display: flex;
}*/

.section-auto-modal .pop-up-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 4rem;
	text-align: center;
}

.section-auto-modal .btn {
	padding: 1.6rem 1.5rem;
}

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

	.section-auto-modal .pop-up-content {
		padding: 0rem 2rem 0rem 2rem;
	}

	.section-auto-modal .btn {
		font-size: 1.2rem;
		letter-spacing: 2px;
	}
  }

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

	body:not(.EditMode) .section-auto-modal .section-block {
		padding: 4rem;
	  }

	  .section-auto-modal .pop-up-content {
		padding: 0rem;
	}

	.section-auto-modal .pop-up-item img {
		display: none;
	}
  }

  @media only screen and (max-width: 450px) {
    body:not(.EditMode) .section-auto-modal .section-block {
      padding: 5rem 2rem;
    }
  }

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

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

@media only screen and (max-width: 1050px) {
    .cards-wrapper.w-33 .card-item {
        width: calc((100% / 2) - 2rem);
    }
}

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

/* Card 3-6 */
.card-3-6 .card-item {
    position: relative;
    padding: 20rem 2rem 2rem;
	
}

.card-3-6 .image-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	
}

.card-3-6 .image-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(var(--black-color), .3);
    transition: .3s ease-in-out;
}

.card-3-6 a.card-item:hover .image-wrapper::after {
    background: rgba(var(--black-color), .6);
}

.card-3-6 .card-body {
    z-index: 1;
    position: relative;
    pointer-events: none;
}
@media only screen and (max-width: 1050px) {
	.card-3-6 .card-item {
		position: relative;
		padding: 30rem 2rem 2rem;
		
	}
}

@media only screen and (max-width: 750px) {
	.card-3-6 .card-item {
		position: relative;
		padding: 30rem 2rem 2rem;
		
	}
}

/* Cards 15 */
.cards-15 .card-item {
    position: relative;
    display: flex;
    align-items: flex-end;
    min-height: 35rem;
    margin: 3rem 0;
}

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

.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: 3rem 2rem 3rem 5rem;
}

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

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

/* Sektionens namn
========================================================================== */
.section-name .cards-15 .image-wrapper {
    border-radius: 0;
}

.section-name .cards-15 .text-wrapper {
    padding: 2rem;
}

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

#top {
	position: absolute;
	top: 0;
	height: 100vh;
	width: 0;
}

#kontakt {
	padding: 1rem 2rem;
}


#kontakt .col-0 {
	background: #111;
	overflow: hidden;
	position: relative;
}

#kontakt h3,
#kontakt h2,
#kontakt p {
	color: #fff;
}

#kontakt .normaltext-type {
	position: relative;
	z-index: 2;
	padding: 12rem 3rem !important;
	box-shadow: inset 0 0 12rem rgba(0, 0, 0, 0.5);
}

/* Intro Section
========================================================================== */

.intro-section .section-block {
	padding-bottom: 0;
}

.intro-section .normaltext-type {
	text-align: center;
}

.intro-section h3 {
	max-width: 50rem;
	margin: 0 auto;
}

.intro-section p {
	text-align: center;
}


/* Boat Slider Section
========================================================================== */

.boat-slider-section {
	overflow: hidden;
}

.boat-slider-section .section-block-wrapper {
	max-width: 70rem;
}

.boat-slider-container {
	background-color: #96c33c;
	margin: 0 5rem;
	display: flex;
	flex-direction: column;
	/* box-shadow: 0 1rem 2rem rgba(33, 115, 130, .25); */
	box-shadow: 0 1rem 2rem rgba(80, 112, 18, .25);
	border-radius: 1rem;
}

.boat-image-slider {
	width: calc(100% + 20rem);
	margin: -5rem -10rem 5rem;
}

.boat-image-slider .slick-list {
	overflow: visible;
}

.boat-image-wrapper {
	padding: 0 5rem;
	transition: all .3s ease;
}

.boat-image-wrapper[aria-hidden="true"] {
	opacity: .5;
	transition: all .3s ease;
}

.boat-text-slider {
	padding: 0 5rem 3rem;
}

.boat-text-slider .slick-track {
	display: flex !important;
}

.boat-text-wrapper {
	display: flex !important;
	align-self: stretch;
	flex-wrap: wrap;
	height: auto !important;
	text-align: center;
}

.boat-text-wrapper .btn-wrapper {
	align-self: flex-end;
	width: 100%;
	margin-top: 3rem;
}

.boat-text-wrapper .btn {
	display: inline-block;
	width: auto;
	padding: 1.3rem 4rem;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

.boat-text-title,
.boat-text-lead {
	width: 100%;
	max-width: 45rem;
	margin: 0 auto;
	text-align: center;
	color: #FFF;
}

.boat-text-lead-big{
	font-size: 2rem;
}

.products-slick a{
	padding: 1rem;
}

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


	.boat-image-slider {
		width: calc(100% + 10rem);
		margin: -5rem -5rem 5rem;
	}

	.boat-image-wrapper {
		padding: 0 2rem;
	}

}

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

	.boat-slider-section .section-block {
		padding: 5rem 0 7.5rem !important;
	}

	.boat-slider-container {
		margin: 0 3rem;
	}

	.boat-image-slider {
		width: calc(100% + 4rem);
		margin: -5rem -2rem 5rem;
	}

	.boat-image-wrapper {
		padding: 0 1rem;
	}

	.boat-text-slider {
		padding: 0 0 2rem;
	}

	.boat-text-wrapper {
		padding: 0 2rem;
	}

	.boat-text-lead {
		font-size: 1.3rem;
	}
}

/* Slick Settings */

.boat-text-slider .slick-prev,
.boat-text-slider .slick-next {
	top: 50%;
}

.boat-text-slider .slick-prev {
	left: -2rem;
}

.boat-text-slider .slick-next {
	right: -2rem;
}

.boat-text-slider .slick-dots {
	left: 0;
	bottom: -1rem;
}

.boat-text-slider .slick-dots li button:before {
	color: #FFF;
}

.slick-prev,
.slick-next {
	width: 4rem;
	height: 4rem;
	border: 1px solid #FFF;
	background-color: #FFF;
	border-radius: 4rem;
	box-shadow: 0 1rem 2rem rgba(0, 0, 0, .1);
}

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

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

.slick-prev.slick-disabled,
.slick-next.slick-disabled {
	opacity: .5;
	background-color: transparent;
	cursor: not-allowed;
}

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

.slick-next {
	right: 8rem;
}

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

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

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
	color: #FFF;
}

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

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

/* Slick för event/nyheten */ 
.slick-dotted.slick-slider {
	text-align: center;
	margin-top: 3rem;
}

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

	.boat-text-slider .slick-prev,
	.boat-text-slider .slick-next {
		top: 5%;
	}

	.boat-text-slider .slick-dots {
		left: 0;
		bottom: -1.5rem;
	}
}


/* Video ratio
========================================================================== */
.video-ratio {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
}

.video-ratio video {
    
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.video-container {
	position: relative;
	padding-bottom: 56.25%;
  }
  
  .video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
  }

/* QR-wrapper
========================================================================== */
.qr-wrapper {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	max-width: 60rem;
	margin: 5rem auto 0;
	background-color: #eaf3d8;
	border: 1px solid #eaf3d8;
	border-radius: 1rem;
}

.qr-wrapper .text-wrapper {
	flex: 1 1 0%;
	padding: 3rem;
}

.qr-wrapper .image-wrapper {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 15rem;
	padding: 2rem;
	background-color: #FFF;
}

.qr-wrapper .image-wrapper img {
	width: 100%;
	height: 100% !important;
	object-fit: contain;
}

@media only screen and (max-width: 550px) {
	.qr-wrapper {
		margin: 5rem 3rem 0;
		width: auto;
	}

	.qr-wrapper .text-wrapper {
		padding: 2rem;
	}

	.qr-wrapper .image-wrapper {
		width: 100%;
		height: 12rem;
	}
}

/* Parallax
========================================================================== */

#scroll {
	background-image: url('https://media.gettyimages.com/photos/color-magazines-up-close-picture-id914198332?s=2048x2048');
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	height: 50rem;
	/* 	box-shadow:inset 0 0px 12rem rgba(0,0,0,0.5); */
}

#scroll .section-block {
	/* 	background:rgba(0,0,0,0.3); */
	height: 100%;
}

/* Sektion CTA
========================================================================== */
.LayoutPage .section-cta .section-block,
.SubPage .LayoutPage .section-cta .section-block {
	padding: 2rem;
}

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

.cta-wrapper {
	position: relative;
	z-index: 1;
	overflow: hidden;
	border-radius: 3px;
	background-color: #111;
}

.cta-wrapper .text-wrapper {
    position: relative;
    z-index: 2;
    padding: 12rem 3rem;
    box-shadow: inset 0 0 12rem rgb(0 0 0 / 50%);
	text-align: center;
}

.parawrap {
	position: absolute;
	left: 0;
	width: 100%;
	top: 0;
}

.parallax {
	background-image: url(/assets/images/greenline-parallax.jpg);
	background-size: cover;
	background-position: center bottom;
	width: 100%;
	height: 200vh;
	transition: ease .1s;
	opacity: 0.75;
}

/* ==========================================================================
Undersidor - gäller alla undersidor 
========================================================================== */

body.SubPage {
	background-image: none !important;
}

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

.SubPage .subpage-header .section-block {
	padding: 20rem 2rem 10rem;
}

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

.SubPage .subpage-header .heading-type *:not(.text-center) {
	text-align: left;
}

.subpage-header h1 {
	padding-bottom: 0;
}

.SubPage .subpage-header-image .section-block {
	padding: 0 2rem;
}

.SubPage .subpage-header-image .section-block-wrapper {
	max-width: 150rem;
}

@media only screen and (max-width: 1024px) {
	.SubPage .subpage-header .section-block {
		padding: 15rem 2rem 7.5rem;
	}
}

@media only screen and (max-width: 550px) {
	.SubPage .subpage-header .section-block {
		padding: 12rem 2rem 5rem;
	}
}

/* Header Image Wrapper
========================================================================== */

.header-image-wrapper {
	position: relative;
	width: 100%;
	height: 50rem;
	overflow: hidden;
	border-radius: 2rem;
}

.header-image-wrapper .simpleParallax {
	position: absolute;
	width: 100%;
	top: 50%;
	transform: translateY(-50%);
}

.header-image-wrapper .simpleParallax img {
	margin-top: 0 !important
}

@media only screen and (max-width: 900px) {
	.header-image-wrapper {
		height: auto;
	}

	.header-image-wrapper .simpleParallax {
		position: relative;
		top: auto;
		transform: none;
	}
}

/* ==========================================================================
Subpage About
========================================================================== */

.subpage-about .normaltext-type {
	text-align: left;
}


.subpage-about .about-section .section-block-wrapper {
	max-width: 150rem;
	display: flex;
}

.scrolling-image {
	width: 100%;
	padding: 0 10rem;
}

@media only screen and (max-width: 1200px) {
	.scrolling-image {
		padding: 0 5rem;
	}
}

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

	.scrolling-image {
		padding: 0;
	}

	.subpage-about .normaltext-type {
		max-width: 60rem;
	}
}

@media only screen and (max-width: 550px) {
	.scrolling-image {
		padding: 0;
	}
}

/* About Section 1
========================================================================== */

.subpage-about .about-section-1 .col-0 {
	width: 40%;
	padding: 0;
}

.subpage-about .about-section-1 .col-1 {
	width: 60%;
	padding: 0;
}

.subpage-about .about-section-1 .normaltext-type {
	margin: 0 0 5rem;
	padding: 0 10rem 0 0;
}

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

	.subpage-about .about-section-1 .section-block-wrapper {
		flex-wrap: wrap-reverse;
	}

	.subpage-about .about-section-1 .col-0 {
		padding: 0 5rem 0 0;
		margin: 0 0 0 auto;
	}

	.subpage-about .about-section-1 .col-1 {
		width: 100%;
	}

	.subpage-about .about-section-1 .normaltext-type {
		margin: 0 auto 10rem 0;
		padding: 0 5rem;
	}

}

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

	.subpage-about .about-section-1 .col-0 {
		padding: 0 2rem 0 0;
		width: 60%;
	}

	.subpage-about .about-section-1 .col-1 {
		width: 100%;
	}

	.subpage-about .about-section-1 .normaltext-type {
		margin: 0 auto 10rem 0;
		padding: 0 2rem;
	}

}

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

	.subpage-about .about-section-1 .normaltext-type {
		padding: 0;
	}
}

/* Fluid Parallax
========================================================================== */

.LayoutPage .fluid-parallax {
	overflow: hidden;
	background-image: linear-gradient(to bottom, #FFF 50%, #f9f9f9 50%);
}

.LayoutPage .fluid-parallax .section-block {
	padding: 0 15rem 0 0;
	position: relative;
	z-index: 1;
}

.LayoutPage .fluid-parallax .section-block-wrapper {
	margin: 0;
	max-width: none;
}

.fluid-parallax .simpleParallax {
	z-index: -1;
	position: absolute;
	width: calc(100% - 20rem);
	left: 0;
	top: 0;
}

.fluid-parallax .simpleParallax::after {
	display: block;
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .4);
	top: 0;
	left: 0;
}

.fluid-parallax .normaltext-type {
	margin: 0;
}

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

	.LayoutPage .fluid-parallax .section-block {
		padding: 0 5rem 0 0;
	}

}

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

	.LayoutPage .fluid-parallax .section-block {
		padding: 0;
	}

}

/* About Section 2
========================================================================== */

.subpage-about .about-section-2 .col-0 {
	width: 60%;
	padding: 0;
}

.subpage-about .about-section-2 .col-1 {
	width: 40%;
	padding: 0;
	align-self: center;
}

.subpage-about .about-section-2 .normaltext-type {
	margin: 0 0 5rem;
	padding: 0 0 0 10rem;
}

@media only screen and (max-width: 1200px) {
	.subpage-about .about-section-2 .normaltext-type {
		margin: 0 0 5rem;
		padding: 0 0 0 5rem;
	}
}

@media only screen and (max-width: 1000px) {
	.subpage-about .about-section-2 .col-0 {
		width: 100%;
	}

	.subpage-about .about-section-2 .normaltext-type {
		padding: 0 2rem;
	}
}

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

	.subpage-about .about-section-2 .normaltext-type {
		padding: 0;
	}
}

/* ==========================================================================
Subpages Single Products
========================================================================== */


/* Common stuff
========================================================================== */

.subpage-single-product h2 {
	font-size: 2rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	word-spacing: .1em;
	padding: 0 0 .5em 0;
}

/* Header Section
========================================================================== */

.subpage-single-product .subpage-header {
	height: auto;
	background-color: rgba(0, 0, 0, 0.45);
	background-size: cover;
	background-attachment: fixed;
	background-position: center bottom;
}

.subpage-single-product .subpage-header * {
	color: #FFF;
	text-shadow: 0 0 3rem rgba(0, 0, 0, .3);
	text-align: left;
}

.subpage-single-product .subpage-header .section-block {
	padding-top: 50vh;
	padding-bottom: 10rem;
}

.subpage-single-product .subpage-header .section-block-wrapper {
	max-width: 120rem;
	padding: 0 10rem;
}

.subpage-single-product .subpage-header .heading-type {
	max-width: 85rem;
}


.subpage-single-product .subpage-header h1 {
	margin-bottom: 1em;
}

.subpage-single-product .subpage-header h2 {
	font-size: 6rem;
	text-transform: none;
	letter-spacing: normal;
	word-spacing: normal;
}

.greenline-33 .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/boats/greenline-33-cover-2.jpg);
}

.greenline-39 .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/boats/greenline-39-cover-2.jpg);
}

.greenline-40 .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/rivieran.jpeg);
}

.greenline-42 .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/greenline-42-2000px.jpg);
}

.greenline-45 .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/greenline-45-ocean-2000.jpg);
}

.greenline-45-coupe .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/boats/greenline-45coupe-cover.jpg);
}

.greenline-48fly .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/boats/greenline-48fly-cover.jpg);
}

.greenline-48-coupe .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/boats/greenline-48coupe-cover.jpg);
}

.oceanclass-68 .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/boats/oc68-cover.jpg);
}

.greenline-traff .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/greenlinesweden-event-1000.jpg);
}

.greenline-58-fly .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/boats/greenline-58-fly-cover-2000px.jpg);
}

.puerto-banus .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/assets/images/aktuellt/puerto-banus-2000px.jpg);
}


@media only screen and (max-width: 1100px) {
	.subpage-single-product .subpage-header .section-block-wrapper {
		padding: 0 5rem;
	}
}

@media only screen and (max-width: 1024px) {
	.subpage-single-product .subpage-header h2 {
		font-size: 4rem;
	}
}

@media only screen and (max-width: 900px) {
	.subpage-single-product .subpage-header .section-block-wrapper {
		padding: 0 2rem;
	}
}

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

	.subpage-single-product .subpage-header .section-block {
		padding-top: 50vh;
		padding-bottom: 5rem;
	}

	.subpage-single-product .subpage-header .section-block-wrapper {
		padding: 0;
	}

	.subpage-single-product .subpage-header h2 {
		font-size: 3rem;
	}
}

/* Product Intro
========================================================================== */

.LayoutPage .product-intro .section-block {
	padding-top: 0;
	padding-bottom: 0;
}

.LayoutPage .product-intro .section-block-wrapper {
	position: relative;
	max-width: 120rem;
	top: -10rem;
	margin-bottom: -15rem;
	background-color: #FFF;
	padding: 5rem 10rem;
	border-radius: 3px 3px 0 0;
}

.product-intro .col-0 {
	margin-bottom: 3rem;
}

.product-intro-image {
	margin-top: 10rem;
}

@media only screen and (max-width: 1100px) {
	.LayoutPage .product-intro .section-block-wrapper {
		padding: 5rem;
	}
}

@media only screen and (max-width: 900px) {
	.LayoutPage .product-intro .section-block-wrapper {
		padding: 5rem 2rem;
	}

	.LayoutPage .product-intro .col-1 {
		width: 100%;
		margin-bottom: 3rem;
		padding: 0;
	}

	.LayoutPage .product-intro .col-2 {
		width: 100%;
		padding: 0;
	}
}

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

	.LayoutPage .product-intro .section-block {
		padding-top: 7.5rem;
		padding-bottom: 0;
	}

	.LayoutPage .product-intro .section-block-wrapper {
		top: 0;
		margin-bottom: 0;
		background-color: #FFF;
		padding: 0;
	}

	.product-intro-image {
		margin-top: 5rem;
	}
}

/* Feature section
========================================================================== */

.feature-section .split-wrapper {
	justify-content: space-between;
}

.feature-section .split-content {
	width: calc(50% - .5rem);
	padding: 8rem 5rem 3rem;
}

.feature-section .split-image {
	width: calc(50% - .5rem);
	margin-bottom: -3rem;
}

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

	.feature-section .split-wrapper.reverse .split-content {
		padding: 5rem 5rem 2rem 2rem;
	}

	.feature-section .split-image {
		margin-bottom: -2rem;
	}
}

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

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

	.feature-section .split-content {
		padding: 10rem 0 5rem;
		width: 100%;
		max-width: 60rem;
		margin: 0 auto;
	}

	.feature-section .split-wrapper.reverse .split-content {
		padding: 10rem 0 5rem;
	}

	.feature-section .split-image {
		width: 100%;
		margin-bottom: 0;
	}
}

@media only screen and (max-width: 550px) {
	.feature-section .split-content {
		padding: 7.5rem 0 3rem;

	}

	.feature-section .split-wrapper.reverse .split-content {
		padding: 7.5rem 0 3rem;
	}

}

/* Product Info section
========================================================================== */

.product-info-section .section-block {
	padding-top: 0;
}

.product-info-section .normaltext-type {
	text-align: left;
}

.product-info-section h2 {
	border-bottom: 1px solid #96c33c;
	margin-bottom: 3rem;
}

/* Text section
========================================================================== */

.text-section .normaltext-type {
	text-align: left;
	margin-top: 3rem;
}

.intro-image {
	margin-bottom: 2rem;
	padding: 0 0 2rem;
	border-bottom: 1px solid #96c33c;
}

.LayoutPage .intro-image img {
	width: 100%;
	max-width: 20rem !important;
	margin: 0 auto;
}

@media only screen and (max-width: 800px) {
	.text-section .col-block {
		width: 100% !important;
		padding: 0 !important;
	}
}

/* Section Map / Karta med nalar
========================================================================== */
.SubPage .LayoutPage .section-boatmap .section-block {
	padding-top: 0;
	padding-bottom: 0;
}

.map-wrapper {
	position: relative;
	z-index: 1;
	display: flex;
	justify-content: space-between;
	overflow: hidden;
	border-radius: 3px;
	background-color: #eaf3d8;
	padding: 5rem 0 5rem 5rem;
}

.map-wrapper .image-wrapper {
	position: relative;
	z-index: -1;
	margin-top: -10rem;
	right: -5rem;
	width: 30rem;
}

.map-wrapper .image-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.map-wrapper ul {
	columns: 2;
	column-gap: 7rem;
	padding: 0 0 0 2rem;
}

.map-wrapper li {
	line-height: 1.4;
	padding: 0 0 .5rem;
}

@media only screen and (max-width: 900px) {
	.map-wrapper {
		padding: 2rem;
	}
}

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

	.map-wrapper {
		margin: 0 -2rem;
		border-radius: 0;
		padding: 5rem 2rem 75%;
	}

	.map-wrapper .image-wrapper {
		position: absolute;
		height: 100%;
		margin-top: 0;
		top: 0;
	}

	.map-wrapper img {
		object-position: center bottom;
		padding-bottom: 2rem;
	}

	.map-wrapper .text-wrapper {
		padding: 0 5rem 0 0;
	}

	.map-wrapper ul {
		columns: 1;
	}
}

/* ==========================================================================
Subpage Om oss
========================================================================== */

.subpage-about-sweden .feature-section .split-content {
	width: 60%;
	padding: 10rem 10rem 10rem 0;
}

.subpage-about-sweden .feature-section .split-wrapper.reverse .split-content {
	padding: 10rem 0 10rem 10rem;
}

.subpage-about-sweden .feature-section .split-image {
	width: 40%;
}

.LayoutPage .feature-section .logo {
	width: 100%;
	max-width: 20rem !important;
	margin: 3rem 0 0;
}

@media only screen and (max-width: 1000px) {
	.subpage-about-sweden .feature-section .split-content {
		padding: 5rem 10rem 10rem 0;
		width: 100%;
		max-width: 60rem;
	}

	.subpage-about-sweden .feature-section .split-wrapper.reverse .split-content {
		padding: 5rem 10rem 10rem 0;
	}

	.subpage-about-sweden .feature-section .split-image {
		width: 100%;
		margin-bottom: 0;
	}
}

@media only screen and (max-width: 550px) {
	.subpage-about-sweden .feature-section .split-content {
		padding: 5rem 0 3rem;
	}

	.subpage-about-sweden .feature-section .split-wrapper.reverse .split-content {
		padding: 5rem 0 3rem;
	}

}

/* Testimonials
========================================================================== */

.client-split-slider {
	display: flex;
	align-items: flex-end;
}

.client-split-image-wrapper {
	width: 65%;
}

.client-split-text-wrapper {
	position: relative;
	width: 45%;
	margin-left: -10%;
	bottom: -10rem;
	padding: 5rem;
	background-color: #FFF;
}

.client-text h2 {
	font-size: 2.8rem;
	padding: 0 0 .3em;
	color: #005677;
}

.client-text-name {
	font-size: 2.1rem;
	font-weight: 400;
	text-transform: none;
	letter-spacing: .05em;
}

.client-text p {
	max-width: 45rem;
	color: #111;
}

.client-split-slider .slick-next {
	right: auto;
	left: 8rem;
	top: auto;
	bottom: -8rem;
}

.client-split-slider .slick-prev {
	left: 3rem;
	top: auto;
	bottom: -8rem;
}

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

	.client-split-slider {
		flex-wrap: wrap;
	}

	.client-split-image-wrapper {
		width: 100%;
	}

	.client-split-text-wrapper {
		position: relative;
		width: 80%;
		margin-left: 10%;
		bottom: auto;
	}
}


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

	.client-split-text-wrapper {
		width: 100%;
		top: 0;
		margin: 0;
		padding: 5rem 0;
	}

	.client-split-slider .slick-next {
		right: 0;
		left: auto;
		top: auto;
		bottom: -6rem;
	}

	.client-split-slider .slick-prev {
		left: auto;
		right: 5rem;
		top: auto;
		bottom: -6rem;
	}

	.client-split-slider .slick-dots {
		width: auto;
	}

	.client-split-slider .slick-dots li {
		width: 1rem;
	}
}


/* ==========================================================================
Subpage Tillval
========================================================================== */

.subpage-tillval .normaltext-type {
	text-align: left;
}


/* ==========================================================================
Subpage Historia
========================================================================== */

.timeline-wrapper {
	position: relative;
	max-width: 80rem;
	margin: 10rem auto 0;
}

.timeline-wrapper::before {
	content: '';
	position: absolute;
	width: 2px;
	background-color: #969696;
	top: 0;
	bottom: 0;
	left: 50%;
	border-radius: 40px;
}

.timeline-text:before {
	content: '';
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: #96c33c;
	position: absolute;
	left: -14%;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-box-shadow: 0 0 0 4px #ffffff;
	box-shadow: 0 0 0 4px #ffffff;
	z-index: 1;
}

.item-right .timeline-text::before {
	left: auto;
	right: -14%;
}


.timeline-item {
	margin-bottom: 3rem;
	position: relative;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: flex-start;
}

.timeline-item.item-left {
	justify-content: flex-end;
}

.timeline-text,
.timeline-image {
	width: 45%;
}


.timeline-text {
	padding-left: 5rem;
}

.timeline-text .timeline-step {
	font-size: 5rem;
	color: #96c33c;
}

.timeline-text h3 {
	line-height: 1.4;
}

.item-right .timeline-image {
	order: 1;
	justify-content: flex-end;
}

.item-right .timeline-text {
	padding-right: 5rem;
	padding-left: 0;
}


.timeline-item .timeline-image {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center;
}

.timeline-item:last-child {
	margin-bottom: 0;
}

.timelime-result {
	font-size: 3rem;
	font-weight: 700;
	color: #96c33c;
	padding: 0;
	line-height: 1;
}

.timelime-result::before {
	content: '#';
	display: inline-block;
	margin-left: -2rem;
	color: #eaf3d8;
}

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

	.timeline-text h3 {
		font-size: 2.4rem;
	}

}

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

	.timeline-text {
		padding-left: 2rem;
	}

	.item-right .timeline-text {
		padding-right: 0;
		padding-left: 2rem;
	}

}

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

	.timeline-wrapper::before {
		left: 0;
	}

	.timeline-item {
		justify-content: flex-end;
	}

	.timeline-item.item-left {
		flex-wrap: wrap-reverse;
	}

	.timeline-text,
	.timeline-image {
		width: calc(100% - 2rem);
	}

	.timeline-text {
		margin-bottom: 2rem;
	}

	.timeline-text:before {
		left: -2.8rem;
	}

	.item-right .timeline-text::before {
		left: -2.8rem;
		right: auto;
	}

}

/* ==========================================================================
Subpage Partners
========================================================================== */
.sub-partner .client-split-text-wrapper {
	background-color: #f9f9f9;
	bottom: -8rem;
}

.sub-partner .partner-quote .section-block {
	padding: 5rem 2rem !important;
}


/* ==========================================================================
Subpage Aktuellt 
========================================================================== */
.sub-aktuellt .contact-option {
    width: 31.333%;
	margin-bottom: 5rem;
	text-align: center;
	padding: 5rem 2rem 2rem 2rem;
}

.sub-aktuellt .contact-option h4{
	font-size: 2rem !important; 
}

.sub-aktuellt .contact-option p {
	padding: 2rem 0rem; 
}

.sub-aktuellt .contact-option a {
	justify-content: center;
}

.sub-aktuellt .btn-link, .btn-link:hover {
    background-color: transparent;
    border-color: transparent;
    color: #96c33c;
	text-align: center !important;
}

@media only screen and (max-width: 980px){
	.sub-aktuellt .contact-option {
	    width: 48%;
	    margin-bottom: 5rem;
	}
}

@media only screen and (max-width: 600px){
	.sub-aktuellt .contact-option {
	    width: 100%;
	    margin-bottom: 3rem;
	}
}

@media only screen and (max-width: 480px) {
	.sub-aktuellt .contact-option h4 {
		text-align: left;
	}
}

/* ==========================================================================
Subpage Contact
========================================================================== */

/* Contact Options */
.contact-option-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

.contact-option {
	width: 40%;
	padding: 2rem 3rem 5rem 3rem;
	background-color: #FFF;
	box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.15);
	border-radius: 2px;
	transition: all .3s ease;
}

.contact-icon {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 8rem;
	height: 8rem;
	margin: -5.5rem auto 2rem;
	color: #FFF;
	font-size: 3rem;
	background-color: #96c33c;
	border-radius: 50%;
	box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.15);
}

.contact-text {
	font-style: normal;
	line-height: 1.8;
}

.contact-option a {
	display: flex;
	align-items: center;
	margin: 0.5rem 0;
	text-decoration: none;
}

.contact-option a:hover {
	color: #96c33c;
}

.contact-option i:not(.contact-icon) {
	padding-right: 2rem;
}

.contact-title {
	text-transform: uppercase;
	font-size: 1.1em;
	letter-spacing: .1em;
	padding: 0;
	color: #96c33c;
}

@media only screen and (max-width: 1024px) {
	.contact-option {
		width: 46%;
		padding: 2rem 3rem 3rem 4rem;
	}
}

@media only screen and (max-width:770px) {
	.contact-option {
		width: 100%;
		margin-bottom: 10rem;
	}
}

/* Karta data */
.map-section {
	font-size: 0;
}

.LayoutPage .map-section .section-block {
	padding: 0 5rem;
}

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

/* ==========================================================================
Subpage Contact
========================================================================== */
.sub-anmalan .subpage-header {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), url(/files/background/greenline-cover-new.jpg);
}

.sub-anmalan .subpage-header h1 {
	text-align: center;
}

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

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

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

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

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

.footer-logo {
	position: relative;
	width: 100%;
	padding: 2rem 0;
	margin: 0 0 5rem;
	border-bottom: 1px solid #969696;
}

.footer-logo img {
	position: relative;
	width: 20rem;
	margin: 0 auto -27px;
}

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

.footer-heading {
	font-size: 1.6rem;
	text-transform: uppercase;
	font-weight: 400;
	letter-spacing: .1em;
	color: #96c33c;
}

/* 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.6rem;
	line-height: 2em !important;
}

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

/* 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 #c2c2c2;
	border-radius: 2rem;
	background-color: #FFF;
	color: #111;
}

.footer .social:hover {
	background-color: #111;
	border-color: #111;
	color: #FFF;
	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';
}

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

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

/* FOOTER PARTNER LINKS */

.partner-list {
	display: flex;
	list-style: none;
}

.partner-list li {
	width: 25%;
	margin: 0 1rem 0 0;
	padding: .5rem;
	border: 1px solid #c2c2c2;
	background-color: #FFF;
	border-radius: 5px;
}

.partner-list img {
	width: 100%;
	filter: grayscale(100%);
}

/* Footer Bottom */

.footer-bottom {
	border-top: 1px solid #acacac;
	margin: 0 auto;
	width: 100%;
	padding: 2rem 0;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap-reverse;
	justify-content: space-between;
	flex-direction: row;
	line-height: 1rem;
}

.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: 3rem;
    margin-left: 1rem;
}

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

	.footer .container {
		padding: 0rem 2rem 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;
	}

	.footer-menu {
		width: 100%;
		margin-bottom: 3rem;
	}

}