@import url("css/bootstrap.min.css");

/*
font-family: 'Roboto', sans-serif;
*/

/*
// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }

// Medium devices (tablets, 768px and up)
@media (min-width: 768px) { ... }

// Large devices (desktops, 992px and up)
@media (min-width: 992px) { ... }

// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }
*/


/* Theme colors 
_________________________________________________*/

/* Primary background-color ----------------------- */
.bg-primary {
	background-color: #0e7c91 !important;
}

/* Accent background-color ----------------------- */
.bg-accent {
	background-color: #cc3300 !important;
}

/* Scales of grey background-color --------------- */
.bg-grey-5 {
	background-color: #f2f3f4 !important;
} 
.bg-grey-10 {
	background-color: #e5e7e8 !important;
}
.bg-grey-20 {
	background-color: #cccfd2 !important;
}
.bg-grey-40 {
	background-color: #999fa5 !important;
}
.bg-grey-60 {
	background-color: #666f78 !important;
}
.bg-grey-80 {
	background-color: #333f4b !important;
}


/* Text colors ----------------- */
.txt-primary {
	color: #0e7c91 !important;
}
.txt-accent {
	color: #cc3300 !important;
}
.txt-grey-5 {
	color: #f2f3f4 !important;
}
.txt-grey-10 {
	color: #e5e7e8 !important;
}
.txt-grey-20 {
	color: #cccfd2 !important;
}
.txt-grey-40 {
	color: #999fa5 !important;
}
.txt-grey-60 {
	color: #666f78 !important;
}
.txt-grey-80 {
	color: #333f4b !important;
}

::selection {
	background: #0e7c91; /* Theme color */
	color: #fff; text-shadow: none;
}


/* End theme colors
––––––––––––––––––––––––––––––––– */




/* 
–––––––––––––––––––––––––––––––––––––––––––––––––
BASE
–––––––––––––––––––––––––––––––––––––––––––––––––
*/

body {
	font-family: 'Roboto', sans-serif;
	font-size: .875rem;
	font-weight: 400; 
	line-height: 1.5;
	color: #333f4b;
	-webkit-font-smoothing: antialiased;  /*Font rendering in Chrome on Mac */
	-moz-osx-font-smoothing: grayscale; /* Font rendering in Firefox on Mac */
}

a, 
a:link, 
a:visited, 
a:active { 
	color: #cc3300; 
	text-decoration: none; 
}
a:hover { text-decoration: underline; }

ul { padding-left: 1rem; }
li { 
	color: rgba(0,0,0,1);
	font-family: 'Roboto', sans-serif;
	font-size:.875rem;
}
td { font-size:.875rem; }

address {
	font-style: normal;
	line-height: inherit;
	margin-bottom: 1rem;
}

img {
	max-width: 100%;
}

.img-fluid {
	width: 100%;
}

/* ____ Text and typography ____ */

h1,h2,h3,h4,h5,h6 {
	color: #666f78;
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	line-height: 1.1;
	margin: 0;
	text-transform: none;
}

h1 {
	color: #0e7c91;
	font-size: 1.75rem;
	font-weight: 700;
	margin-bottom: 1rem;
	text-transform: initial;
}

h2 {
	font-size: 1.5rem;
	margin-bottom: .5rem;
	margin-top: 2rem;
}

h3 {
	font-size: 1.25rem;
	margin-bottom: .25rem;
	margin-top: 1.5rem;
}

h4 {
	font-size: 1.125rem;
	margin-bottom: .25rem;
	margin-top: 1.5rem;
	text-transform: uppercase;	
}

h5 {
	font-size: 1rem;
	margin-bottom: .25rem;
	margin-top: 1.5rem;
}

h6 {
	font-size: .875rem;
	margin-bottom: .25rem;
	margin-top: 1.5rem;
}

h3 + h4 {
	margin-top:.75em;
}

p {
	color: #333f4b;
	font-family: 'Roboto', sans-serif;
	font-size: .875rem;
	font-weight: 400;
	line-height: 1.5;
	margin-bottom: 1em;
}

p:last-child {
	margin-bottom:0;
}

h2 + h3, p:first-child {
	margin-top:1rem;
}

p.ingress {
	color: #333f4b;
	font-family: 'Roboto', sans-serif;
	font-size:	1rem;
	font-weight: 500;
	line-height: 1.4;
	margin: .75rem 0;
}


/* Breakpoints Text and typography */

@media (min-width: 576px) {
body { font-size: 1rem; }
h1,h2,h3,h4,h5,h6 {
	-webkit-hyphens: manual;
	-ms-hyphens: manual;
	hyphens: manual; /*hyphen only at ‐ or ­ (if needed)*/
}
p { 
	font-size:1rem; 
	margin-bottom:1em; 
}
p.ingress { 
	font-size: 1.25rem;
	margin: 1rem 0;
}

li,td { font-size:1rem; }
}

@media (min-width: 768px) { 
h1 { font-size:2rem; }
h2 { font-size:1.75rem; }
h3 { font-size:1.5rem; }
h4 { font-size:1.125rem; }

}

.fa, .fas, .fab {
	margin-right: 0.5rem;

}

/* 
–––––––––––––––––––––––––––––––––––––––––––––––––
HEADER AND NAVBAR
–––––––––––––––––––––––––––––––––––––––––––––––––
*/
#navbar-site .container-fluid {
	background-color: #fff;
}

.navbar {
	background: #fff;
	padding: 0;
}
 #desktopMenu {
	background-color: #fff;
	display: none;
	height: 104px;
}

#desktopMenu .language-object {
		flex-direction: row;
		margin-right: 1rem;
		align-self: flex-end;
	}
	
#desktopMenu .language-object img {	
		margin-left: 0.2rem;
		
	}
	
#desktopMenu .language-object a {	
		cursor: pointer;
		
	}

/* --- Toggler icon --- */
.navbar-toggler {
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: none;
    padding: .25rem 0;
    margin-right: 1rem;
}
.navbar-toggler {
    border-color: transparent;
}
.snurr {
	transition: transform .25s ease-in-out;
}
.snurr-active {
	transform: rotate(90deg);
}
.navbar-toggler .navbar-toggler-icon {
  	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0,1)' stroke-width='3' stroke-linecap='butt' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}


.navbar-toggler:focus {
	outline: none;
}

/* --- Logotyp --- */
.navbar-brand {
	background-color: #fff;
	padding: .5rem 0;
	margin-left: 1rem;
}
.navbar-brand img {
	height: 50px;
}
/* End logotyp */


/* Mobilmeny */

#mobileMenu {
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

#mobileMenu .mainmenu {
	margin: 0;
}

#mobileMenu .mainmenu .nav-link {
	font-family: 'Roboto', sans-serif; 
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: #000;
	padding: 0.75rem 1rem;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}

#mobileMenu .caret{
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    border: none;
    border-radius: 0;
    padding: 15px 0;
    width: 49px;
    height: 45px;
    font-size: 1rem;
    line-height: 1.2em;
    text-align: center;
    color: #333333;
}

#mobileMenu .caret:before{
	content: '\f061' !important;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}

#mobileMenu li.show .caret:before{
	content: '\f063' !important;
}

#mobileMenu .dropdown-menu {
	border: none;
	border-radius: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	padding: 0.5rem 0;
	margin: 0;
}

#mobileMenu .mainmenu .dropdown-menu .nav-link {
	border: none;
	padding: 0.75rem 1.75rem;

}

#mobileMenu .language-object {	
		margin-left: 1rem;
		
	}

#mobileMenu .language-object img {	
		margin: 1rem 0 1rem 0.2rem;
		
	}

/* Desktopmeny */


#desktopMenu .nav-item { 
}
#desktopMenu .mainmenu .nav-link {
	font-family: 'Roboto', sans-serif; 
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: #000;
	padding: 0.75rem 1rem;
	white-space: nowrap;

}
#desktopMenu .mainmenu .nav-link:hover {
	background-color: #f2f3f4;
}
/* --- Dropdown meny --- */
#desktopMenu .dropdown-menu {
 	margin-top: 1px;
	padding: 0;
	border: 1px solid #f0f0f1;
	border-radius: 0;
	top: 80px;
}

#desktopMenu .mainmenu > li:last-child .dropdown-menu {
	left: auto;
	right: 0;
}


.dropdown-toggle::after {
    display: none;
}

#desktopMenu .mainmenu .dropdown-menu .nav-link{
	padding: 0.75rem 1rem;
	text-transform: none;
	border-bottom: 1px solid rgba(0, 0, 0, 0.05);
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	font-size: 0.875rem;
	background-color: #ffffff;
}

#desktopMenu .mainmenu .dropdown-menu li:last-child .nav-link {
	border-bottom: none;

}

#desktopMenu .dropdown-menu li a:hover {
	background-color: #f4f5f6;
}

#desktopMenu .dropdown-menu li a.active, #desktopMenu .dropdown-menu li a:active {
	background-color: #47B3B3;
}

#desktopMenu .dropdown-menu li a,
#desktopMenu .dropdown-menu li a:link,
#desktopMenu .dropdown-menu li a:visited,
#desktopMenu .dropdown-menu li a:active {
	color: #323c4b;
}

.mainmenu {
	flex: 1
}

/* --- Breakpoints header and navbar --- */
@media (min-width: 992px) { 

	#mobileMenu {
		display: none !important;
	}

	#desktopMenu {
		display: flex;
	}

	.navbar > .container-fluid {
	    padding-left: 0;
	    padding-right: 0;
	}
	.navbar-brand { 
		padding: 1.25rem 0 .75rem;
	}
	.navbar-brand img { 
		height:75px; 
		padding-left:0;
	}
	.navbar-collapse {
		background-color: transparent;
		flex-direction: column;
	}
	.mainmenu 	{ 
		margin-left: 1rem;
		align-self: flex-end;
	}
	#desktopMenu .mainmenu .nav-link 	{ 
		color: #000;
		font-size: 0.875rem;
		padding: 2.6rem 1rem;
	}
	#desktopMenu .nav-item  {
		border-top:none;
	}
	#desktopMenu .mainmenu .nav-link:hover {
		background-color:transparent;
		color: #cc3300;
	}
}



@media (min-width: 768px) { 
	#navbar-site .container-fluid {
		padding-left: 2rem; 
		padding-right: 2rem;  
	}
}

@media (min-width: 1200px) { 
	#navbar-site .container-fluid {
		padding-left: 0 8vw; 
	} 
}


/* 
END HEADER AND NAVBAR 
––––––––––––––––––––––––––––––––––––––––––––––––– */



/* Feature media 
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#feature-media {
  	background-attachment:fixed;
/*  	background-image: linear-gradient(45deg, rgba(255,255,255,.8) 50%, rgba(255,255,255,0.8) 50%), url(images/feature-img.jpg);*/
	background-image: url(images/feature-img.jpg);
  	background-position: center right;
  	background-size:cover;
  	display:flex;
  	flex-wrap: wrap;
  	align-content: center;
  	height:75vh;
  	margin-top: 65px;
}
.feature-caption {
	align-self: center;
  	background-color:transparent;
  	padding: 0 1rem;
  	text-align: center;
  	width:100%;
}
.feature-caption h1 {
	border-bottom: 1px solid #000;
	padding-bottom: .75rem;
	margin-bottom: .75rem;
	font-size: 2rem;
	font-weight: 500;
	font-family: 'Roboto', sans-serif;
	line-height: 1;
	text-transform: inherit;
	-webkit-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;

}
.feature-caption p {
	font-family: 'Roboto', sans-serif;
	font-size: 1.25rem;
	font-weight: 400;
	line-height: 1.3;
	/*text-shadow:0 0 10px rgba(0,0,0,.3);*/
	text-transform: none;
}

/* --- Breakpoints Feature media --- */
@media (min-width: 576px) {
	.feature-caption 	{
		text-align: left;
		width: 80%;
	}
	#feature-media {
/*	  	background-image: linear-gradient(60deg, rgba(255,255,255,0.8) 20%, rgba(255,255,255,0.5) 75%), url(images/feature-img.jpg); */
	  	background-image: url(images/feature-img.jpg);
	}

}

@media (min-width: 992px) {
#feature-media {
/*  	background-image: linear-gradient(30deg, rgba(255,255,255,1) 20%, rgba(255,255,255,0) 75%), url(images/feature-img.jpg);*/
  	background-image: url(images/feature-img.jpg);
  	margin-top: 105px;
}
.feature-caption {
	padding-left: 8vw;
}
.feature-caption h1 { 
	font-size: 3rem;
}
.feature-caption p {
	font-size: 1.5rem;
}
}

@media (min-width: 1200px) { 
.feature-caption 	{
	width: 64.5%;
}
.feature-caption h1 { 
	font-size: 3.5rem;
}
.feature-caption p {
	font-size: 1.75rem;
}
}
/* ____________ END Feature media ____________ */


/* --------- Intro text section ---------- */
#site-intro {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding-bottom: 2rem;
	padding-top: 2rem;
}
#site-intro h1 {
	color: #0e7c91;
	font-size: 1.25rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}
#site-intro p {
	font-size: 1rem;
}
.site-intro__text {
	width: 100%;
}
@media (min-width: 992px) {  
.site-intro__text {
	width: 70%;
}	
#site-intro {
	padding-bottom: 8rem;
	padding-top: 4rem;
}
#site-intro h1 {
	font-size: 1.5rem;
}
#site-intro p {
	font-size: 1.25rem;
}
}

/* --------- Business areas section ---------- */
#business-areas {
	text-align: center;
	padding-top: 2rem;
	padding-bottom: 2rem;
}
#business-areas.padding-space {
	padding: .5rem .5rem;
}
#business-areas h2 {
	color: #0e7c91;
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: .05em;
	margin: 0;
	text-transform: uppercase;
	white-space: nowrap;
}
#business-areas p { 
	color: #fff;
	font-size: .875rem;
}

.area-item {
	background-color: #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,0.16), 0 1px 2px rgba(0,0,0,0.23);
	flex: 1 0 220px;
	margin: .5rem;
	position: relative;
	transition: all 0.3s (.25,.8,.25,1);
}
.area-item .pil {
  color: #fff;	
	font-size: 1rem;
	line-height: 1;
	position: absolute;
	right: .75rem;
	bottom: .75rem;
	display: none;
}

.area-item .pil a {
	color: #ffffff;
}

.area-item:hover {
	box-shadow: 0 3px 6px rgba(0,0,0,0.25), 0 3px 6px rgba(0,0,0,0.22);
}
.img-overlay {
	display: flex;
	flex-direction: column;
	height: 5rem;
	overflow: hidden;
	position: relative;
}

.overlay {
	display: flex;
	flex-direction: column;
	justify-content: center;
  	position: absolute;
  	top: 0;
  	bottom: 0;
  	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	transition: .3s ease;
	background-color: rgba(14,124,145,0.85);
}

.area-item:hover .overlay {
  opacity: 1;
  background-color: rgba(14,124,145,0.85);
}

.text {
  color: #fff;
  font-size: .875rem;
  text-align: center;
  padding: 2rem;
  display: none;
}

.text a {
	color: #ffffff;
}


.area-item a {
	text-decoration: none;
}
.area-item img { 
	width: 100%;
	height: auto;
}

.area-item-header {
	padding: .5rem;
	height: auto;
}



/* Breakpoints Business areas */
@media (min-width: 576px) {
	.img-overlay {
		display: flex;
		flex-direction: column;
		height: auto;
		overflow: initial;
	}
}

@media (min-width: 768px) {
	#business-areas {
		justify-content: space-between;
	}
	#business-areas h2 {
		font-size: 1rem
	}
	.area-item {
		flex-grow: 0;
		flex-shrink: 1;
		flex-basis: calc(50% - 1.25rem);
		margin: 0;
	}
}

@media (min-width: 992px) { 
		#business-areas {
			border-top: 9rem solid #cccfd2;
			padding-top: 0;
			padding-bottom: 5rem;
		}
		#business-areas h2 {
			font-size: 1.125rem
		}
		.area-item {
			margin-top: -70px;
		}
		.area-item-header {
			padding: 1.6rem;
			height: 70px;
		}
		.text {
			display: inherit;
		}
		.area-item .pil {
			color: #fff;
			font-size: 1rem;
			right: 1rem;
			bottom: 1rem;
	}
}

@media (min-width: 1200px) {
	#business-areas h2 {
		font-size: 1.25rem
	}

}

@media (min-width: 1400px) {
	.text {
	  	font-size: 1.125rem;
	}
	.area-item .pil {
		display: inherit;
		font-size: 2rem;
	}

}





/* Fixing IE11 flexbox issues */

@media (min-width: 504px) and (max-width: 739px) and (-ms-high-contrast: active), (-ms-high-contrast: none) {

	.img-overlay {
		max-height: 123px;			
	}

	.area-item:nth-child(3) .img.overlay {
		max-height: 246px;
	}
}


@media screen and (min-width: 992px) and (-ms-high-contrast: active), (-ms-high-contrast: none) {

	.img-overlay {
		max-height: 162px;
	}
}


@media screen and (min-width: 1200px) and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.img-overlay {
		max-height: 177px;
	}
}


@media screen and (min-width: 1400px) and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.img-overlay {
		max-height: 209px;
	}
}




/* ------- END Business areas -------- */



/* ___________ About Section ___________ */
#about-section {
	background-image: url(images/feature-img.jpg); 
	background-attachment: fixed;
	background-size: cover; 
	background-position: center right;
	display:flex;
  	flex-wrap: wrap;
	min-height: 33vw;
}
.about-caption {
	align-self: center;
  	background-color: rgba(255,255,255,.75);
  	text-align: left;
  	width:100%;
}
.about-caption hr {
	border-color:#000;
	border-width: 1px;
	margin-top: .5rem;
	margin-bottom: .5rem;
}
.about-caption h1 {
	border-bottom: 1px solid #000;
	padding-bottom: .5rem;
	margin-bottom: .75rem;
}


.about-caption ul {
	list-style: none;
	padding: 0;
    margin: .5rem 0 0;
    position: relative;
}
.about-caption li {
	color: #333f4b;
 	font-size: 1rem;
 	line-height: 1.2;
    margin-bottom: .5rem;
    padding-left:1.5rem;
}
.about-caption li:before {
	color: #cc3300;
	content: "\f061";
 	font-family: 'Font Awesome 5 Free';
 	font-weight: 900;
 	position:absolute;
 	left: 0;
}
.about-caption p.phone {
	border: 1px solid #0e7c91;
	border-radius: 3px;
	color: #333f4b;
 	font-size: 1rem;
 	font-weight: 500;
 	text-transform: uppercase;
 	text-align: center;
 	padding: 1rem;
}
.about-caption p.phone:before {
	color: #cc3300;
	content: "\f095";
 	font-family: 'Font Awesome 5 Free';
 	font-weight: 900;
 	margin-right: .25rem;
}

@media (min-width: 576px) {
	.about-caption 		{ width: 80%; }
	.about-caption h1 	{ font-size: 2rem; }
}
@media (min-width: 992px) {
	.about-caption 		{ width: 60%; }
	.about-caption h1 	{ font-size: 3rem; }
	.about-caption li,
	.about-caption p.phone
	 	{ font-size: 1.25rem;}
}
@media (min-width: 1200px) {
	.about-caption 		{ width: 50%; }
}



/* ___________ Promo Section ___________ */
#promo-section {
	background-color: #0e7c91;;
	display: flex;
	flex-wrap: wrap;
	/*min-height: 33vw;*/
	text-align: center;
}
#promo-section h2  {
	font-size: 1.5rem;
	font-weight: 500;
	font-family: 'Roboto', sans-serif;
	line-height: 1.3;
	margin: 0 0 1rem;
	/*text-shadow:0 0 15px rgba(255,255,255,.3);*/
	text-transform: inherit;
	-webkit-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;

}
#promo-section p  {
	color: #333f4b;
	font-weight: 400;
	font-size: 1rem;
}
#promo-section .promo-capture { 
	align-self: center;
	background: rgba(255, 255, 255, 0.6);
	background: transparent;
	padding: 1rem;
}


@media (min-width: 576px) { 
	#promo-section p { font-size: 1rem; }
}
@media (min-width: 768px) { 
	.promo-capture { 
		margin-left: 25%;
		text-align: left;
	}
	#promo-section p  {
		font-size: 1.25rem;
	}


}
@media (min-width: 992px) { 
	.promo-capture { 
		margin-left: 50%;
	}
	#promo-section h2  {
		font-size: 2rem;	
	}
	
	#promo-section {
		/*background-image: url(images/plastteknik-bg-blue-4.png);
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center left;
		background-attachment: scroll;*/
	}	
}


/* promo section with all white text */

#promo-section h2  {
	color: #ffffff;
}

#promo-section p  {
	color: #ffffff
}

#promo-section a.btn-outline {
	color: rgba(255,255,255,1);
	border: 1px solid rgba(255,255,255,1);
}

#promo-section a.btn-outline:hover {
	color: rgba(255,255,255,0.5);
	border: 1px solid rgba(255,255,255,0.5);
	background-color: transparent;
}

/* ____________ Nyheter på startsidan ____________ */

#recent-news .responsive {
	display: flex;

}

#recent-news h2 {
	color: #000;
	font-weight: 500;
	margin: 0 0 1rem;
}

.news-post .post-date {
	color: rgba(0,0,0,.5); 
	font-family: 'Roboto', sans-serif;
	font-size: 0.75rem;
	font-weight: 400; 
	text-transform: uppercase; 
}
.news-post {
    margin: 0 1rem;
    background: transparent; 
 }
.news-post img {
    width: 100%;
    height: auto;  
 }
.news-post h3 {
	font-size: 1.25rem;
	margin-top: 0;
}
.news-post .body-text {
    background-color: #fff;
    padding: 1rem;
}
.news-post p.read-more {
	text-align: center;
}
.news-post .read-more a {
	color: #0e7c91;
	font-size: .875rem;
	font-weight: 500;
	text-align: right;
	text-transform: uppercase;
	text-decoration: none;
}
.news-post .read-more a:hover {
	color: #333f4b;
}
.news-post .read-more a::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f061";
    margin-left: .25rem;
}

/*
@media (min-width: 992px) {
	.news-post h3 { font-size: 1.5rem; }
}
*/

/* ----- Slick horizontal scroll pattern ----- */

#recent-news .slick-prev, .slick-next {
    width:  34px;
    height: 34px;
    overflow: hidden;
    z-index: 1000;
}
#recent-news .slick-prev {
    left: -17px;
    display: none !important;
}
#recent-news .slick-next {
    right: -17px;
    display: none !important;
}
#recent-news .slick-prev:before,
#recent-news .slick-next:before
{
    font-family: 'slick';
    font-size: 28px;
    line-height: 1;
    opacity: 1;
    color: #666f78;
}
#recent-news .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
    opacity: .5;
}
#recent-news .slick-dots {
    bottom: -2rem;
}
#recent-news .slick-dots li button:before
{
    font-family: 'slick';
    font-size: 10px;
    line-height: 20px;
}
#recent-news .slick-dots li.slick-active button:before
{
    opacity: 1;
    color: #cc3300;
}

#recent-news .slick-track {
	display: flex !important;
}

#recent-news .slick-slide {
	height: auto !important;
	background-color: #ffffff;
}

@media (min-width: 992px) {
	.slick-dots {
		display: none !important;
	}
}

/* ____________ Nyheter på undersidan ____________ */


.aktuellt-list {
	border-bottom: 1px solid #f2f3f4;
    padding-bottom: 1rem;
}


.aktuellt-artikel .post-date {
	margin-top: 1rem;

}


.aktuellt-list .post-date, .aktuellt-artikel .post-date {
	color: #929394;	
    margin-bottom: 0.25rem;
}

.aktuellt-list h3, .aktuellt-artikel h3  {
	margin: 0;
}

.aktuellt-list .ng-binding p:first-child, .aktuellt-artikel .ng-binding p:first-child {
	margin-top: 0.25rem;
}

.aktuellt-list .readmore a {
	color: #0e7c91;
    font-size: .875rem;
    font-weight: 500;
    text-align: right;
    text-transform: uppercase;
    text-decoration: none;	
}

.aktuellt-list .readmore a:after {
	font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f061";
    margin-left: .25rem;
}

.aktuellt-artikel h4 {
	border-bottom: 1px solid #f2f3f4;
    padding-bottom: 1rem;	
    margin-top: 3rem;
    font-size: 1.5rem;
    color: #007b92;
}

/* --- END Recent News --- */


/* ____________ Quote  ____________ */

#testimonial {
  	flex: 1 0 360px;
  	background-color: #0e7c91;
}
#testimonial img { 
	margin-bottom: 1.25rem;
}
#testimonial p { 
	color: #000;
	font-size: 0.875rem;
	line-height: 1.2;
	text-transform: uppercase;	
}
#testimonial p.quote {
	font-family: 'Roboto', sans-serif;
	font-size: 1.125rem;
	font-weight: 400; 
	line-height: 1.5;
	text-transform: unset;
}
#testimonial p.quote::before {
 	font-family: "Font Awesome 5 Free";
 	font-weight: 700; 
 	content: "\f10d";
 	padding-right: .5rem;
	color: #000;
}
#testimonial p.quote::after {
 	font-family: "Font Awesome 5 Free";
 	font-weight: 700; 
 	content: "\f10e";
 	padding-left: .5rem;
	color: #000;
}
/* Breakpoints: Quote*/
@media (min-width: 768px) {
	#testimonial p.quote  { 
				font-size: 1.375rem;
	}
}

/* ____________ Contact  ____________ */


.contact-list h2 {
	font-size: 1.5rem;
	margin-top: 1rem;
	border-top: 1px solid #0e7c91;
	padding-top: 1rem;
}

.contact-list ul {
	padding: 1rem 0 0;
	margin: 1rem 0 0;
	list-style-type: none;
	border-top: 1px solid #f2f3f4;
}

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

.contact-list a {
	color: #0e7c91;
}

.contact-list strong {
	font-weight: 600;
}


.contact-list iframe {
	margin-top: 1rem;
}

/* 
–––––––––––––––––––––––––––––––––––––––––––––––––
SIDFOT 
–––––––––––––––––––––––––––––––––––––––––––––––––
*/
#sidfot {background-color: #f0f0f1;}
#sidfot,
#sidfot h3,
#sidfot h4,
#sidfot p,
#sidfot a,
#sidfot li a {
	color: #cccfd2;
}
#sidfot .svg-inline--fa {
	color: #cccfd2;
}
#sidfot img {
	opacity: .25;
	padding: 1rem 2rem;
}

#sidfot p,
#sidfot li {
	font-size: .875rem;
}
#sidfot h3	{ 
	border-bottom: 1px solid #cccfd2; 
	font-family: 'Roboto', sans-serif;
	font-size: 1.25em;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	margin-top: 0;
	margin-bottom: 1.25rem;
	padding-bottom: 0.5rem;
}
#sidfot h4	{ 
	font-size: 1em;
	margin-top: 1.75rem; 
}
#sidfot ul {
 	list-style-type: none;
    margin: .75rem 0;
    padding: 0;
}
#sidfot li { padding-bottom: .25rem; }


/* --- Form --- */
#sidfot label {
	margin-bottom: .25rem;
}
#sidfot input {
	border-radius: 0;
	background-color: #f2f3f4;
}
#sidfot input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #0e7c91;
	font-size: .875rem;
	text-transform: uppercase;
}
#sidfot input:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #0e7c91;
    font-size: .875rem;
    text-transform: uppercase;
}
#sidfot input::-ms-input-placeholder { /* Microsoft Edge */
	color: #0e7c91;
    font-size: .875rem;
    text-transform: uppercase;
}
/* END Form */


#sidfot iframe {
	filter: grayscale(100%);
}
#sidfot .svg-inline--fa { margin-right: .5rem; }
#sidfot [class^="col-lg-"] {
     margin-bottom: 0;
     padding-bottom: 3rem;
     border-bottom: none;
}
#sidfot [class^="col-lg-"]:last-child { padding-bottom: 0; }

#sidfot .social { display: flex; }

 #sidfot .social .svg-inline--fa {
     font-size: 2.5rem;
     margin-right: 1rem;
}

/* End footer */
#end-footer {
	background-color: rgba(0,0,0,.2);
}
#end-footer p {
	color: rgba(255,255,255,.3);
	font-size: .75rem;
	margin-top: 0;
	text-align: right;
	text-transform: uppercase;
}
@media (min-width: 992px) { 
	#sidfot [class^="col-lg-"], #end-footer [class^="col-lg-"] { 
		padding-bottom: 0;
	}
}


/* 
END SIDFOT 
–––––––––––––––––––––––––––––––––––––––––––––––––
*/

/* _______________ Theme Button  _______________ */

/* Bootstrap buttons */

/* Button basic */
.btn {
	border-radius: 2px;
	padding: 0.75em 2em;
	font-size: 0.875rem;
	text-transform: uppercase;
	line-height: 1;
	font-family: 'Roboto', sans-serif; 
	font-weight: 600;
	letter-spacing: 0.05em;

}
/* Large button */
.btn-large {
	padding: 1.25em 2em;
}

/* Button theme color */
.btn-primary {
	background-color: #47B3B3;
	border-color:rgba(255,255,255,.6) rgba(0,0,0,0.15) rgba(0,0,0,0.25) rgba(255,255,255,.4);
	text-shadow:none;
}

a.btn-primary {
	color: #000;
}

.btn-primary:hover {
	color: #fff;
	background-color: #000;
	border-color: #000;
}
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {
	color: #fff;
	background-color: #000;
	border-color: #000;
}

/* Outline button */
.btn-outline {
	background-color: rgba(255,255,255,0);
	border: 1px solid #0e7c91;
}

a.btn-outline {
	color: #0e7c91;
}
.btn-outline:hover {
	color: #cc3300;
	background-color: rgba(255,255,255,0.5);
	border-color: #cc3300;
}

.btn-outline-white {
	background-color: rgba(0,0,0,0);
	border: 1px solid #fff;
	color: #fff;
}

a.btn-outline-white {
	color: #fff;
}
.btn-outline-white:hover {
	border-color: rgba(255,255,255,.5);
	color: rgba(255,255,255,.5);
}

.btn:focus {
	outline: none;
}


/* END Buttons */

/* ---------- Link Group ---------- */

.link-group {
  padding-left: 0;
  margin-bottom: 0;
}
.link-group a {
  font-size: .875rem;
  font-weight: 500;
  text-decoration: none;
  text-transform: uppercase;
}
.link-group a::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  content: "\f061";
  padding-right: .25rem;
  transition: padding-right .15s;
}
.link-group a:hover::before {
	padding-right: 1rem; 
}

.link-group-item {
  position: relative;
  display: block;
  background-color: transparent;
  border-bottom: 1px solid rgba(0,0,0,.2);
  padding: .75rem 0; 
}
@media (min-width: 992px) {
.link-group a {
  font-size: 1rem;
}

}
/* ---------- END Link Group ---------- */



/* ____________ Padding x space ____________ */
.padding-x-space { 
	padding-left: 1rem; 
	padding-right: 1rem; 
}

@media (min-width: 768px) { 
	.padding-x-space 	{ 
		padding-left: 2rem; 
		padding-right: 2rem;  
	}
}

@media (min-width: 1200px) { 
	.padding-x-space {
		padding-left: 8vw; 
		padding-right: 8vw;
	} 
}

/* Enkel men inte optimal lösning för css fixed position paralax bakgrund på mobila enheter  */
@media only screen 
  	and (min-device-width: 320px) 
  	and (max-device-width: 1112px)
  	and (-webkit-min-device-pixel-ratio: 2) { 
#feature-media, 
#about-section {
  	background-attachment: scroll;
}
}

/* ____ Singel column margin-bottom on small screens ____ */

[class^="col-sm-"], 
[class^="col-md-"], 
[class^="col-lg-"] { 
	margin-bottom: 3rem; 
}

[class^="col-sm-"]:last-child, 
[class^="col-md-"]:last-child, 
[class^="col-lg-"]:last-child { 
	margin-bottom: 0; 
}


[class^="col-md-"] > [class^="col-md-"] {
	margin-bottom: 4rem;
}

@media (min-width: 576px) {
	[class^="col-sm-"] {
	margin-bottom: 0;
}
}
@media (min-width: 768px) { 
	[class^="col-md-"] {
	margin-bottom: 0;
	}
}
@media (min-width: 992px) { 
	[class^="col-lg-"] {
	margin-bottom: 0;
	}
}

/* Content in a box */
.panel 	{ 
	border-radius: 4px;
	background-color: #f4f5f6;
	margin: 2rem 0;
	padding: 1rem; 
}



/* 
–––––––––––––––––––––––––––––––––––––––––––––––––––––
SUBPAGE 
–––––––––––––––––––––––––––––––––––––––––––––––––––––
*/

#subpage {
  margin-top: 66px; /* Same as hight of the page header*/
  margin-bottom: 3rem;
}
#subpage #header-img img {
  width: 100%;
  height: auto;
}
#subpage header h1 {
	font-size: 1.25rem;
	margin: 1rem 0;
	color: #000;
}
#subpage .main-content, 
#subpage .side-bar {
  padding-top: 2rem;
}

#subpage .col-lg-4:first-child,
#subpage .col-lg-8:first-child {
  margin-bottom: 0;
}

#subpage h2:first-child,
#subpage h3:first-child,
#subpage h4:first-child {
  margin-top: 0;
}

/* Side-bar Subpage */
#subpage .side-bar { display: none; }
#subpage .side-bar.side-bar-left  { padding-right: 0; }
#subpage .side-bar.side-bar-right { padding-left: 0; }

/* Side-bar Menu */
.side-bar nav {
	margin-bottom: 3rem;
	margin-top: 1.5rem;
}
.side-bar nav ul {
	list-style-type:none;
	margin:0;
	padding:0;
	width:100%;
}

.side-bar nav li {
	border-bottom:1px solid #cccfd2;
}

.side-bar nav li:first-child {
	/*border-top: 1px solid #429ea9;*/
}

.side-bar nav ul li:last-child {
	margin-bottom:0;
}

.side-bar nav li a {
	color: #333f4b;
	display: block;
	font-family: 'Roboto', sans-serif; 
	font-size: .875rem;
	font-weight: 700;
	letter-spacing: .05em;
	line-height: 1;
	padding: 15px 0;
	text-decoration:none;
	text-transform: uppercase;
	}

.side-bar nav li a:hover {
	color: #cc3300;
}

.side-bar nav li.selected > a {
	color: #0e7c91;
}


.side-bar nav {
	margin-top: 0;
}

.side-bar .submenu .submenu {
	padding-left: 1rem;
	margin-bottom: 1rem;
	display: none;
}	

.side-bar .submenu .selected {
	color: #0e7c91;

}

.side-bar .submenu .selected .submenu {
	display: block;
}


.side-bar .submenu .submenu li {
	border-bottom: none;
}	

@media (min-width: 576px) {

}

@media (min-width: 768px) {
	
}

@media (min-width: 992px) {
	#subpage {
		margin-top: 107px;
	} /* Same as height of the page header*/

	#subpage .main-content, 

	#subpage .side-bar {
		padding-top: 3rem;
	}

	#subpage header h1 {
		font-size: 1.5rem;
		margin: 1.5rem 0;
	}

	#subpage .side-bar {
		display: block;
	}

	#subpage .side-bar.side-bar-left  {
		padding-right:1rem;
	}

	#subpage .side-bar.side-bar-right {
		padding-left:1rem;
	}
}

/* Sticky section header –––––––––––––––––––––– */



#subpage nav.subsub-pages-list h3 {
	border-top: 1px solid #cccfd2;
	padding-top: 1rem;
	color: #0e7c91;
	margin-top: 1rem;
}


nav.subsub-pages-list ul {
	list-style-type: none;
	padding-left: 0;
	margin-left: 0;
	margin-top: 1.25rem;
}

nav.subsub-pages-list li a {
	color: #333f4b;
	display: block;
	font-family: 'Roboto', sans-serif; 
	font-size: .875rem;
	font-weight: 700;
	letter-spacing: .05em;
	line-height: 1;
	padding: 0 0 1.25rem;
	text-decoration:none;
	text-transform: uppercase;
}


nav.subsub-pages-list li a:before {
	color: #cc3300;
	content: "\f061";
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	margin-right: 5px;
}

nav.subsub-pages-list li:last-child a {
	padding-bottom: 0;
}


@media (min-width: 992px) {

	nav.subsub-pages-list {
		display: none;

	}

}

/* End mobile sub-sub-page navbar –––––––––––––––––––––– */


/* Sticky Section Header –––––––––––––––––––––– */
#subpage .sticky-header {
	background-color: #f2f3f4;
	position: -webkit-sticky;
	position: sticky;
	top: 66px;
	z-index: 997;
}
#subpage .sticky-header h1 {
	color: #666f78;
	font-weight: 500;
	font-size: 1rem;
	margin: 0;
	padding: 1rem 0;
	text-transform: uppercase;
}
@media (min-width: 992px) {
	#subpage .sticky-header { 
		top: 107px;
	}
	#subpage .sticky-header h1 {
		font-size: 1.25rem;
	}
}
/* 
END Sticky hader––––––––-–––––––––– */


/* Certificates –––––––––––––––––––––– */


.cert-box {
	display: -webkit-box; 
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex; 
	display: flex;

	flex-direction: row;
	flex-wrap: wrap;
	max-width: 100%;
	width: 100%;
}

.cert-box > div {
	flex-basis: 100%;
}

.cert-box > div img {
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    margin: 1rem 0;
}

@media (min-width: 550px) {

	.cert-box {
		flex-wrap: nowrap;
	}

	.cert-box > div {
		flex-basis: 50%;
		padding-right: 1rem;
	}

	.cert-box > div img {
	    box-shadow: 0 0 10px rgba(0,0,0,0.1);
	}	

}

@media (min-width: 767px) {

	.cert-box {
		flex-wrap: nowrap;
	}

	.cert-box > div {
		flex-basis: auto;
		padding-right: 1rem;
	}

	.cert-box > div img {
	    box-shadow: 0 0 10px rgba(0,0,0,0.1);
	}	

}

/* 
END SUBPAGE 
––––––––––––––––––––––––––––––––––––––––––––––––– */