/*
1. Custom Bootstrap
2. Skip Navigation
3. General Styling
4. General Title
4.1 General Title Main
5. General Image
5.1 General Image Size / Shape
6. Site Header
6.1 Site Header Logo
6.2 Site Header (white)
6.3 Site Header Search
7. Navigation
8. Mobile Navigation
9. Section General
9.1 Section Padding
9.2 Section Background
10. Article General
11. General Button
12. Column 
12.1 Column Media
12.2 Column Background
12.3 Column Vertical Align
13. List
13.1 Listelement Title Size
13.2 Employee List
14. Target Last Same Width Row in Grid (Beta)
15. Search result
16. White
17. Form
18. Misc
20. Site Sub footer
21. Calendar
21.1 Calendar Template 1
21.2 Calendar Template 2
21.3 Calendar Template 3

40. Element Feedback
41. Element Imagebanner
42. Element Right and Left Content - Text and Image
42.1 Element Right and Left Content Padding
42.2 Element Right and Left Content Width
42.3 Element Right and Left Content w/ Background Color
43. Open/close content

97. Rotating Elements
97. Flexslider

*/

/*
=======================================================================
	1. Custom Bootstrap
=======================================================================
*/

.container .container {padding:0!important;margin:0!important;width:auto!important;}

.containerwidth {margin-left:auto;margin-right:auto;}

@media (min-width:1300px) {.container {max-width:1270px;}}
@media (min-width:1400px) {.container {max-width:1370px;}}
@media (min-width:1500px) {.container {max-width:1470px;}}

@media (min-width:1300px) {.containerwidth {max-width:1210px;}}
@media (min-width:1400px) {.containerwidth {max-width:1310px;}}
@media (min-width:1500px) {.containerwidth {max-width:1410px;}}


/*
=======================================================================
	2. Skip Navigation
=======================================================================
*/

#tilinnhold, #tilnavigasjon {
	position: absolute;
	overflow: hidden;
	z-index:99999;
	text-align:center;
	width:100%;
	color:#fff;
	top:-35px;
	font-size:18px;
	-webkit-transition: all 0.3s ease;                  
	-moz-transition: all 0.3s ease;                 
	-o-transition: all 0.3s ease;   
	-ms-transition: all 0.3s ease;          
	transition: all 0.3s ease;
	}

#tilinnhold:focus, #tilnavigasjon:focus {
	height:40px;
	line-height:40px;
	text-align:center;
	width:100%;
	top:0;
	background: #000;
	}


/*
=======================================================================
	3. General styling
=======================================================================
*/

html {font-size: 100%;}

body {
    font-weight: normal;
    line-height: 1.45;
}

main:focus {outline:0;}

h1,h2,h3,h4,h5,h6 {
	margin:0 0 1.25rem 0;font-weight:bold;
	}

h1 {font-size:1.8rem}
h2 {font-size:1.6rem}
h3 {font-size:1.5rem}
h4 {font-size:1.5rem}
h5 {font-size:1.5rem}
h6 {font-size:1.5rem}
.xltitle h1.page-section-title {font-size: 3.2rem;font-weight:900;}
.xltitle h2.page-section-title {font-size: 2.6rem;font-weight:900;}

a {
	text-decoration: none;
	-webkit-transition: all 0.3s ease;                  
	-moz-transition: all 0.3s ease;                 
	-o-transition: all 0.3s ease;   
	-ms-transition: all 0.3s ease;          
	transition: all 0.3s ease;
	}

a:focus,
a:hover {color:#000;}

blockquote { border-left: 5px solid #929292;}

section blockquote {margin:20px 0 0 0;}
section div[class*="col-"] ~ blockquote {margin:0;}
section blockquote p {margin:0;padding:0;}


@media only screen and (min-width:768px) {
	body {font-size: 16px;}
	h1 {font-size:3rem}
	.xltitle h1.page-section-title {font-size:3rem;}
	h2 {font-size:1.7rem}
	.xltitle h2.page-section-title {font-size:3rem;}
	h3 {font-size:1.3rem}
	h4 {font-size:1.3rem}
	h5 {font-size:1.2rem}
	h6 {font-size:1.1rem}
	}

@media only screen and (min-width:991px) {
	body {font-size: 17px;line-height: 1.65;}
	h1 {font-size:2.8rem}
	.xltitle h1.page-section-title {font-size:4rem!important;}
	h2 {font-size:1.7rem}
	.xltitle h2.page-section-title {font-size:4rem!important;}
	h3 {font-size:1.4rem}
	h4 {font-size:1.4rem}
	h5 {font-size:1.3rem}
	h6 {font-size:1.2rem}
	}

@media only screen and (min-width:1200px) {
	body {font-size: 19px;}
	h1 {font-size:3.5rem}
	.xltitle h1.page-section-title {font-size:5rem!important;}
	h2 {font-size:1.7rem}
	.xltitle h2.page-section-title {font-size:5rem!important;}
	h3 {font-size:1.4rem}
	h4 {font-size:1.4rem}
	h5 {font-size:1.3rem}
	h6 {font-size:1.2rem}
	}


/*
=======================================================================
	4. Margins
=======================================================================
*/

:root {
    --default-margin: min(8vh, 1.5rem);
    --default-margin-0: 0;
    --default-margin-1: min(10vh, 3rem);
    --default-margin-2: min(11vh, 5rem);
    --default-margin-3: min(12vh, 6rem);
    --default-margin-4: min(13vh, 10rem);
}


/*
=======================================================================
	4. General Title
=======================================================================
*/

.page-section-title {margin-bottom:2rem}

h1.page-section-title {font-size:2.5rem;}
h2.page-section-title {font-size:2rem;}	
h3.page-section-title {font-size:1.75rem;}	
h4.page-section-title {font-size:1.75rem;}	
h5.page-section-title {font-size:1.75rem;}	
h6.page-section-title {font-size:1.75rem;}	

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

@media only screen and (min-width:991px) {
	.page-section-title {margin-bottom:2.5rem}

	h1.page-section-title {font-size:3rem;}
	h2.page-section-title {font-size:2.5rem;}	
	h3.page-section-title {font-size:2rem;}	
	h4.page-section-title {font-size:2rem;}	
	h5.page-section-title {font-size:2rem;}	
	h6.page-section-title {font-size:2rem;}	
	}

@media only screen and (min-width:1200px) {
	.page-section-title {margin-bottom:3rem}
	
	h1.page-section-title {font-size:3.5rem;}
	h2.page-section-title {font-size:2.5rem;}	
	h3.page-section-title {font-size:2rem;}	
	h4.page-section-title {font-size:2rem;}	
	h5.page-section-title {font-size:2rem;}	
	h6.page-section-title {font-size:2rem;}	
	}


/*
=======================================================================
	4.1 General Title Main
=======================================================================
*/

.page-article h2:first-of-type {margin-bottom:1.25rem;}

@media only screen and (min-width:768px) {
	article.page-article h1 {font-size:2.8rem}
	article.page-article h2 {font-size:2rem!important;margin-bottom:1rem!important;}
	}

@media only screen and (min-width:991px) {
	article.page-article h1  {font-size: 3rem}
	article.page-article h2  {font-size: 2rem!important;}
	}

@media only screen and (min-width:1200px) {
	article.page-article h1  {font-size: 3.2rem}
	article.page-article h2  {font-size: 2rem!important;}
	}


/*
=======================================================================
	5. General Image
=======================================================================
*/

.circular figure .thumb {
	-webkit-border-radius: 1000px;
	-moz-border-radius: 1000px;
	border-radius: 1000px;	
	}

.circular figure  {margin-left: auto;margin-right:auto;}
.circular figure a:hover		 {background: none;}

figure figcaption {font-size:0.9em;opacity:0.8;
	-webkit-transition: all 0.3s ease;                  
  -moz-transition: all 0.3s ease;                 
  -o-transition: all 0.3s ease;   
  -ms-transition: all 0.3s ease;          
  transition: all 0.3s ease;
	}

figure:hover figcaption {opacity:1;}


/*
=======================================================================
	5.1 General Image Size / Shape
=======================================================================
*/

.img-fluid {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
    }

/* Article image styles */
.thumb  {/*margin:0 auto;*/width:100%;}
.large-media {width: 100%; margin: 0 0 1.5rem 0;}

.small-media {
	position:relative;
	-webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
	}
	
.small-media:after {
	position:absolute;
	top:10px;
	right:10px;
	font-family: "Font Awesome 5 Pro";
	content: "\f055";
	margin-left:10px;
	opacity:0.7;
	color:#fff;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	pointer-events: none;
	}

.small-media:after:hover {opacity:1;}	

.small-media.fullwidth:after {
	-moz-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	}

[class^="small-media"]:hover {cursor:pointer;}

.small-media.fullwidth { width: 100%; float:right; margin: 0 0 20px 0;}
.small-media.fullwidth img {width:100%;}
.small-media-left { width: 40%; float:left; margin: 0 20px 20px 0;}
.small-media-left.fullwidth { width: 100%; float:left; margin: 0 0 20px 0;}

.small-media-right { width: 40%; float:right; margin: 0 0 20px 20px;}
.small-media-right.fullwidth { width: 100%; float:right; margin: 0 0 20px 0;}

figure {position:relative;}
figure a:hover,
a:hover figure {background: #fff;display:block;}

@media screen and (min-width: 768px) {
	.large-media {margin: 0 0 1.75rem 0;}
	}
	
@media screen and (min-width: 991px) {
	.large-media {margin: 0 0 2rem 0;}
	figure a:hover img,
	a:hover figure img {opacity:0.90;}
	}

@media screen and (min-width: 1200px) {
	.large-media {margin: 0 0 2.5rem 0;}
	}




/*
=======================================================================
	6. Site Header
=======================================================================
*/

header.mainheader {position:relative;z-index:999;border-bottom: 1px solid rgba(0,0,0,0.15);}
header.mainheader > .container {position:relative;}

header.mainheader div[class*="col-"] {height:100%;}

header.mainheader .header-elements {display: flex;    justify-content: space-between;align-items: center;padding-top:15px;padding-bottom:15px;width:100%;}
/*header.mainheader .header-elements .header-element {display: table-cell;vertical-align:middle;}*/


/*
=======================================================================
	6.1 Site Header Logo
=======================================================================
*/

.site-logo {
    /*width:150px;*/
	-webkit-transition: width 0.7s ease;                  
	-moz-transition: width 0.7s ease;                 
	-o-transition: width 0.7s ease;   
	-ms-transition: width 0.7s ease;          
	transition: width 0.7s ease;
	}

@media screen and (min-width: 768px) {
	/*.site-logo {width:200px;}*/
	}
	
@media screen and (min-width: 991px) {
	}

@media screen and (min-width: 1200px) {
	/*.site-logo {width:275px;}*/
	}


/*
=======================================================================
	6.2 Site Header (white)
=======================================================================
*/

header.white {color:#fff;}
header.white .site-navigation ul.sf-menu a,
header.white .site-navigation ul.sf-menu:hover a {color: #fff;text-decoration:none!important;}
header.white .site-navigation ul.sf-menu > li > a {opacity:0.8;border-bottom: 4px solid transparent;}
header.white .site-navigation ul.sf-menu > li.active > a {opacity:1;border-color:#fff;}
header.white .site-navigation ul.sf-menu > li > a:hover {opacity:1;}


/*
=======================================================================
	6.3 Site Header Search
=======================================================================
*/

.bttn-site-search a {position:static;padding-right:0;}
.bttn-site-search a:after {
	font-family: "Font Awesome 5 Pro";
	content: "\f002";
	padding-left: 10px;
}

.bttn-site-search a[aria-expanded="true"]:after {content: "\f00d";}

.wrapper-site-search-outer {display:none;padding-bottom:10px;}
.wrapper-site-search {display:table;height:100%;width:100%;}
.wrapper-site-search-inner {display:table-cell;vertical-align:middle;}

.site-search {
	width:100%;
	padding:0;
	border: 0;
	margin-top:0;
	margin-bottom:0;
	-webkit-transition: all 0.15s ease-out;
	-moz-transition: all 0.15s ease-out;
	transition: all 0.15s ease-out;
	border: 1px solid rgba(0, 0, 0, 0.3);
	background: #fff;
	}
	
.site-search div {
	box-sizing: border-box;
	width: 100%;
	display: table-cell;
	}

.site-search input[type=text] {
	height: 45px;
	line-height:50px;
	width: 100%;
	padding: 0 20px;
	float:left;
	margin: 0;
	border: 0;
	color: #000;
	font-size: 1em;
	font-weight:100;
	background: #fff;
	-webkit-transition: all 0.15s ease-out;
	-moz-transition: all 0.15s ease-out;
	transition: all 0.15s ease-out;
	}

.site-search input[type=text]:focus {outline:0;}

.site-search button {
	float:left;
	width: 45px;
	height: 45px;
	border: 0;
	background-color:transparent;
	background-image: url(../images/icon-search.png);
	background-repeat: no-repeat;
	color: #bfbfbf;
	cursor: pointer;
	font-size: 1.4em;
	-webkit-transition: all 0.15s ease-out;
	-moz-transition: all 0.15s ease-out;
	transition: all 0.15s ease-out;
	}

.site-search button:hover {
	opacity:1;
	}


/*
=======================================================================
	7. Navigation
=======================================================================
*/

.site-navigation {float:right;}
.site-navigation .sf-menu > li {display:none;}

.site-navigation ul.sf-menu > li > ul > li:first-child {position:relative;}
.site-navigation ul.sf-menu > li > ul > li:first-child:before {
	content:"";
	position:absolute;top:-10px;left:45px;
	width: 0; 
	height: 0; 
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid hsl(var(--dropdown));
	}

.site-navigation ul.sf-menu > li > ul > li:first-child:hover:before {
	border-bottom: 10px solid hsl(var(--dropdown-hover));
	}

.site-navigation ul.sf-menu > li > a {font-size:1em;color:#828282;font-weight:400;}
.site-navigation ul.sf-menu > li:hover > a {color:#000;}
.site-navigation ul.sf-menu li a.sf-with-ul:after {
	font-family: "Font Awesome 5 Pro";
	content: "\f107";
	padding-left: 10px;
	}

.site-navigation  ul.sf-menu li li a.sf-with-ul:after {
	font-family: "Font Awesome 5 Pro";
	content: "\f105";
	padding-left: 10px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	}

.site-navigation  ul.sf-menu li li:hover a.sf-with-ul:after {
	padding-left: 20px;
	}

.site-navigation  ul.sf-menu li li:hover {
	background:hsl(var(--dropdown-hover));
	}

.mobile-nav.btn-hamburger {display:block!important;}
.mobile-nav.bttn-site-search {display:block!important;}
.mobile-nav.mini-basket {display:block!important;}


@media screen and (min-width: 768px) {
	}
	
@media screen and (min-width: 991px) {
	.site-navigation ul.sf-menu > li > a {font-size:1.1em;}

	}

@media screen and (min-width: 1200px) {
	.site-navigation .sf-menu > li {display:inline-block;padding: .75em 1em;}
	.site-navigation .sf-menu > li > a {padding: 0;}
	.site-navigation .sf-menu > li li a {padding: .75em 1em;}
	}


/*
=======================================================================
	Mobile navigation / Mmenu / Fast food (V2)
=======================================================================
*/

.mainheader .header-elements .sf-menu li.mobile-nav a {font-size: 1em;}


.mobile-nav.btn-hamburger a {padding-right:0;}
.mobile-nav.btn-hamburger a:after {
	font-family: "Font Awesome 5 Pro";
	content: "\f0c9";
	display:inline-block;
	margin-left:7px;
	}

.mm-opened .mobile-nav.btn-hamburger a:after {
	content: "\f00d";
	}

@media screen and (min-width: 576px) {
	.mainheader .header-elements .sf-menu li.mobile-nav a {font-size: 1.1em;}
	}	

@media screen and (min-width: 768px) {
	.mainheader .header-elements .sf-menu li.mobile-nav a {font-size: 1.2em;}
	}
	
@media screen and (min-width: 991px) {
	}

@media screen and (min-width: 1200px) {
	.mobile-nav.btn-hamburger {display:none!important;}
	}


/*
=======================================================================
	Mmenu IE fix
=======================================================================
*/

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.mm-menu {
		z-index: 10
		}
	}


/*
=======================================================================
	Mobile navigation / Mmenu / Fast food
=======================================================================
*/

/*
.c-hamburger {
  display: none;
  overflow: hidden;
  margin: 0;
  padding: 0;
  width: 30px;
  height: 40px;
  font-size: 0;
  text-indent: -9999px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-shadow: none;
  border-radius: none;
  border: none;
  cursor: pointer;
  -webkit-transition: background 0.3s;
          transition: background 0.3s;
	background:none;
	z-index:999999;
	}

.c-hamburger:focus {
  outline: none;
	}

.c-hamburger span {
  display: block;
  position: absolute;
  top: 17px;
  left: 0;
  right: 0;
  height: 4px;
	}

.c-hamburger span::before,
.c-hamburger span::after {
  position: absolute;
  display: block;
  left: 0;
  width: 100%;
  height: 4px;
  content: "";
	}

.c-hamburger span::before {
  top: -10px;
	}

.c-hamburger span::after {
  bottom: -10px;
	}
	
header .c-hamburger {
  position: absolute;
	top:50%;
	margin-top:-20px;
	right:15px;
	}

header .c-hamburger span {background: #000;}
header .c-hamburger span::before,
header .c-hamburger span::after {
  background-color: #000;
	}

header.white .c-hamburger span {background: #fff;}
header.white .c-hamburger span::before,
header.white .c-hamburger span::after {
  background-color: #fff;
	}

@media (max-width:767px) {
	.c-hamburger {display:block;}
	}
*/

/*
=======================================================================
	9. Section General
=======================================================================
*/

section.fullwidth > .container {padding:0;max-width:100%;}

/*section {overflow:hidden;}*/

[class*="darker-"] {position: relative;}
[class*="darker-"]:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	}

/* Remove margin-bottom on last element */
div[class*="listelement-"] > :last-child, 
div[class*="listelement-"] .listtext  > :last-child,
.column-content > :last-child {margin-bottom:0!important;}

.bordertop {border-top:1px solid #e0e0e0;}
.borderbottom {border-bottom:1px solid #e0e0e0;}

section.justify-content-center .container .row {
    -ms-flex-pack: center!important;
    justify-content: center!important;
}

section.justify-content-right .container .row {
    -ms-flex-pack: right!important;
    justify-content: right!important;
}


/*
=======================================================================
	9.1 Section Padding
=======================================================================
*/

.home-top-clean {margin-top: 0;}

/* Standard */
.topspace, .topspace2 {padding-top: var(--default-margin-2);}
.bottomspace, .bottomspace2 {padding-bottom: var(--default-margin-2);}

/* Standard + */
.topspace3 {padding-top:var(--default-margin-3);}
.bottomspace3 {padding-bottom:var(--default-margin-3);}

/* Standard ++ */
.topspace4 {padding-top:var(--default-margin-4);}
.bottomspace4 {padding-bottom:var(--default-margin-4);}

section:not(.background-color):not(.background-image):not(.borderbottom).bottomspace + 
section:not(.background-color):not(.background-image):not(.bordertop).topspace {padding-top:0;}

/* For 'Text and Image' */
section:not(.background-color):not(.background-image):not(.borderbottom).bottomspace + 
section:not(.background-color):not(.background-image):not(.bordertop).elementtopspace2 {margin-top:0;}


/*
=======================================================================
	9.2 Section Background
=======================================================================
*/

.bg-cover {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center center;
    }

.bg-fixed {
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-color: #464646;
    height:100%;
    }


/*
=======================================================================
	10. Article General
=======================================================================
*/

article {}

article blockquote {margin-top:0;margin-bottom:0;}

article .text a {text-decoration:underline;}

article .text p {padding:0;}

article .text > * {margin-bottom:1.5rem;}
article .text > :last-child {margin-bottom:0;}

article .byline {margin-top:2rem;font-size:0.8em;color: rgba(0,0,0,.5);}
article .byline-author {font-size:0.8em;}
article .byline-author:before {
	font-family: "Font Awesome 5 Pro";
	content: "\f2be";
	margin-right:10px;
	display:inline-block;
	}

article .byline-date {margin-top:.2rem;color: rgba(0,0,0,.5);font-size:0.8em;}
article .byline-date:before {
	font-family: "Font Awesome 5 Pro";
	content: "\f017";
	margin-right:10px;
	display:inline-block;
	}


article .teaser {margin-bottom:2rem;font-size:1.15rem;}

.text h1,.text h2,.text h3,.text h4,.text h5,.text h6 {margin-bottom:1.5rem;}
.text *:not(figure) + h1,
.text *:not(figure) + h2,
.text *:not(figure) + h3,
.text *:not(figure) + h4,
.text *:not(figure) + h5,
.text *:not(figure) + h6,
.text *:not(figure) > h1,
.text *:not(figure) > h2,
.text *:not(figure) > h3,
.text *:not(figure) > h4,
.text *:not(figure) > h5,
.text *:not(figure) > h6{margin-top:2.5rem;}

.text * + h1,.text * + h2,.text * + h3,.text * + h4,.text * + h5,.text * + h6,
.text * > h1,.text * > h2,.text * > h3,.text * > h4,.text * > h5,.text * > h6 {margin-bottom:0.75rem;}

article .text ol,
article .text ul {padding-bottom: 0.5rem;}

article .text ol li,
article .text ul li {margin-bottom: 0.35rem;}

.bordertop {border-top:1px solid #e0e0e0;}
.borderbottom {border-bottom:1px solid #e0e0e0;}


@media screen and (min-width: 768px) {
	article p.teaser {font-size:1.2rem;}
	}
	
@media screen and (min-width: 991px) {
	article p.teaser {font-size:1.25rem;}
	}

@media screen and (min-width: 1200px) {
	article p.teaser {font-size:1.4rem;}
	}

/*
=======================================================================
	11. General Button
=======================================================================
*/

.bttns {margin: -.75rem;}
.bttns .bttn {margin: .75rem;}

.bttn {
    color: #000;
    border: 2px solid #000;
    padding: 11px 30px;
    display: inline-block;
    text-decoration: none !important;
    background: none;
    text-transform: uppercase;
    font-size:17px;
		white-space: normal;
    }

.bttn:hover {
    text-decoration: none;
    background: #000;
    color: #fff;
    }

.bttn-solid {
    background: #563d7c;
    color:#fff;
    border-color:transparent;
}

.white .bttn {
    color: #fff;
    border: 2px solid #fff;
    }

.white .bttn:hover {
    color: #000;
    background: #fff;
    }

@media (min-width:1200px) {
    .bttn {
        padding: 11px 30px;
        letter-spacing: 2px;
    }
}

.er-edit-link {
    float: right;
}

/*
=======================================================================
	12. Column 
=======================================================================
*/

.listelement-col .column {height: 100%;}
.listelement-col .column-content a {display: inline-block;}
.listelement-col .column-content h3 a {color:#333;}
.listelement-col .column-content .teaser {}
.listelement-col .column-content .bttn {width: 100%;}

.listelement-col figure {margin:0;}
.listelement-col .column,
.listelement-col .column-content-wrapper,
.listelement-col figure,
.listelement-col .column-content {
    background-image: no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

    .xltitle .col h2 {font-size: 2rem;}

    @media (min-width:350px) {
        .listelement-col .column-content .bttn {
            width: auto;
            display: inline-block;
        }
    }


/*
=======================================================================
	2 Column General
=======================================================================
*/

@media (max-width:767px) {
    .listelement-col:last-child {margin-bottom:0!important;}
    }


/*
=======================================================================
	3 Column General
=======================================================================
*/

@media (max-width:767px) {
    
    }

/*
=======================================================================
	4 Column General
=======================================================================
*/

@media (max-width:767px) {
   
    }








/*
=======================================================================
	12.1 Column Media
=======================================================================
*/

.row-col figure {
    width: 100%;
    padding-bottom: 1.5rem;
    }

.row-col figure img {width: 100%;}
.row-col.circular figure {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    }

.row-col.circular figure img {
    max-width: 300px;
    }

@media (min-width:991px) {
    .row-col.circular figure { /*padding-top:2rem;*/
        width: 100%;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

.row-col.circular figure img {
        max-width: 220px;
        }
    }

@media (min-width:1200px) {
    .row-col.circular figure {}
    .row-col.circular figure img {
        max-width: 250px;
        }
    }


/*
=======================================================================
	12.2 Column Background
=======================================================================
*/

    /* Column content padding */
    .colbg .column-content,
    .colbgimg .column-content {
        padding: 1.5rem;
    }

    /* Column figure padding */
    .colbg figure,
    .colbgimg figure {
        padding-bottom: 0;
    }

    .circular .colbg figure {
        padding-top: 1.5rem;
    }

    .circular .colbgimg figure {
        padding-top: 1.5rem;
    }

    /* --- */

    .listelement-col.colbg .column-content h3,
    .listelement-col.colbgimg .column-content h3 {
        margin-top: 0;
    }

    .colbgimg .listelement-col > div {
        position: relative;
    }

        .colbgimg .listelement-col > div .column-content {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
        }

        .colbgimg .listelement-col > div .column-background-image {
            display: block;
            visibility: hidden;
            width: 100%;
        }

    .listelement-col > div .column-background-image {
        display: none;
    }

    /* Vertical position content with backgorund image */
    .colbgimg .listelement-col > div .column-content {
        position: absolute;
        left: 0;
        width: 100%;
        height: auto;
    }

    .colbgimg.col-va-top .listelement-col > div .column-content {
        top: 0;
    }

    .colbgimg.col-va-middle .listelement-col > div .column-content {
        top: 50%;
        transform: translateY(-50%);
    }

    .colbgimg.col-va-bottom .listelement-col > div .column-content {
        top: auto;
        bottom: 0;
    }

    /* END Vertical position */


    .listelement-col > div {
        position: relative;
    }

    .listelement-col .coverlink {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 3;
    }

        .listelement-col .coverlink:hover {
            background: rgba(255,255,255, 0.2);
        }

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

    @media (min-width:991px) {
        .circular .colbg figure,
        .circular .colbgimg figure {
            padding-top: 1.5rem;
        }

        .colbg .column-content,
        .colbgimg .column-content {
            padding: 2rem;
        }
    }

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


/*
=======================================================================
	Column Background Large Image
=======================================================================
*/

    /* Column Background Image */
    .listelement-col.colbgimg .column {
        background-position: center center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        overflow: hidden;
    }


/*
=======================================================================
	12.3 Column Vertical Align
=======================================================================
*/

    section:not(.col-small-image).col-va-top .row.list {
        align-self:flex-start;
    }

    section:not(.col-small-image).col-va-middle .row.list > div[class*="col-"] {
        align-self:center;
    }

    section:not(.col-small-image).col-va-bottom .row.list > div[class*="col-"] {
        align-self:flex-end;
    }


/*
=======================================================================
	Column Dynamic
=======================================================================
*/

.row-col-dynamic > :last-child {
    margin-bottom: 0 !important;
    }


/*
=======================================================================
    13. List
=======================================================================
*/

    .row-list.center .row-list-wrapper {
        justify-content: center;
    }

    div[class*="listelement-"] h1,
    .listelement h1 {
        margin: 0 0 15px 0;
        padding: 0;
        font-weight:bold;
    }

    .listelement a {
        color: #000;
        }

    .listelement a:hover {
        text-decoration: none;
        }

    .listelement a:hover h1 {
        text-decoration: underline;
        }

    .listelement-large-image img {
        margin: 0;
        width: 100% !important;
        height: 100% !important;
    }

    *[class*="listelement-"] figure {
        margin-bottom: 1rem;
    }

    .listtext a:first-of-type {
        text-decoration: none;
    }

    .listtext a:hover {
        text-decoration: underline;
    }

    .listtext .listteaser {
        font-size: .9em;
    }

    .listdate {
        display: inline-block;
        opacity: 0.75;
        font-size: 0.9em;
    }

        .listdate + .listteaser {
            margin-top: 1rem;
        }

    .pagination {
        margin-top: 1rem;
        margin-bottom: 0;
    }

        .pagination > .active > a,
        .pagination > .active > a:focus,
        .pagination > .active > a:hover,
        .pagination > .active > span,
        .pagination > .active > span:focus,
        .pagination > .active > span:hover {
            z-index: 3;
            color: #fff;
            cursor: default;
            background-color: #404040;
            border-color: #404040;
        }

        .pagination > li > a,
        .pagination > li > span {
            color: #404040;
            background-color: transparent;
        }


    .list-button {
        margin-top: 1rem;
    }

    .bttn.bttn-list {
        margin-top: 0;
    }


    @media (min-width:768px) {
        .col-sm-12.listelement-small-image figure {
            margin-bottom: 0;
        }
    }

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

    @media (min-width:1200px) {
        .col-lg-12.listelement-small-image figure {
            margin-bottom: 0;
        }

        .pagination, .list-button {
            margin-top: 2rem;
        }
    }


    /*
=======================================================================
	13.1 Listelement Title Size
=======================================================================
*/

    /* No image */
    .list > .col-2.listelement-no-image-plain h1 {font-size: 0.6rem !important;} /* not likely to happen at all */
    .list > .col-3.listelement-no-image-plain h1 {font-size: 0.8rem !important;} /* not likely to happen at all */
    .list > .col-4.listelement-no-image-plain h1 {font-size: 1rem !important;} /* not likely to happen */
    .list > .col-6.listelement-no-image-plain h1 {font-size: 1.2rem !important;}
    .list > .col-12.listelement-no-image-plain h1 {font-size: 1.4rem !important;}/* one column full width */

    @media (min-width:576px) {
        .list > .col-sm-2.listelement-no-image-plain h1 {font-size: 0.6rem !important;} /* not likely to happen at all */
        .list > .col-sm-3.listelement-no-image-plain h1 {font-size: 1rem !important;}
        .list > .col-sm-4.listelement-no-image-plain h1 {font-size: 1.2rem !important;}
        .list > .col-sm-6.listelement-no-image-plain h1 {font-size: 1.4rem !important;}
        .list > .col-sm-12.listelement-no-image-plain h1 {font-size: 1.6rem !important;} /* one column full width */
    }

    @media (min-width:768px) {
        .list > .col-md-2.listelement-no-image-plain h1 {font-size: 0.6rem !important;} /* not likely to happen at all */
        .list > .col-md-3.listelement-no-image-plain h1 {font-size: 1rem !important;}
        .list > .col-md-4.listelement-no-image-plain h1 {font-size: 1.2rem !important;}
        .list > .col-md-6.listelement-no-image-plain h1 {font-size: 1.4rem !important;}
        .list > .col-md-12.listelement-no-image-plain h1 {font-size: 1.6rem !important;} /* one column full width */
    }

    @media (min-width:991px) {
        .list > .col-lg-2.listelement-no-image-plain h1 {font-size: 1rem !important;} /* not likely to happen */
        .list > .col-lg-3.listelement-no-image-plain h1 {font-size: 1.1rem !important;}
        .list > .col-lg-4.listelement-no-image-plain h1 {font-size: 1.2rem !important;}
        .list > .col-lg-6.listelement-no-image-plain h1 {font-size: 1.4rem !important;}
        .list > .col-lg-12.listelement-no-image-plain h1 {font-size: 1.6rem !important;} /* one column full width */
    }

    @media (min-width:1200px) {
        .list > .col-xl-2.listelement-no-image-plain h1 {font-size: 1rem !important;}
        .list > .col-xl-3.listelement-no-image-plain h1 {font-size: 1.4rem !important;}
        .list > .col-xl-4.listelement-no-image-plain h1 {font-size: 1.6rem !important;}
        .list > .col-xl-6.listelement-no-image-plain h1 {font-size: 1.6rem !important;}
        .list > .col-xl-12.listelement-no-image-plain h1 {font-size: 2rem !important;} /* one column full width */
    }

    /* Large image */
    .list > .col-2.listelement-large-image h1 {font-size: 0.6rem;}/* not likely to happen at all*/
    .list > .col-3.listelement-large-image h1 {font-size: 0.8rem;}/* not likely to happen */
    .list > .col-4.listelement-large-image h1 {font-size: 1rem;}/* not likely to happen */
    .list > .col-6.listelement-large-image h1 {font-size: 1.2rem;}
    .list > .col-12.listelement-large-image h1 {font-size: 1.4rem;}/* one column full width */

    @media (min-width:576px) {
        .list > .col-sm-2.listelement-large-image h1 {font-size: 0.6rem;}/* not likely to happen at all */
        .list > .col-sm-3.listelement-large-image h1 {font-size: 1rem;}
        .list > .col-sm-4.listelement-large-image h1 {font-size: 1.2rem;}
        .list > .col-sm-6.listelement-large-image h1 {font-size: 1.4rem;}
        .list > .col-sm-12.listelement-large-image h1 {font-size: 1.6rem;}/* one column full width */
    }

    @media (min-width:768px) {
        .list > .col-md-2.listelement-large-image h1 {font-size: 0.6rem;}/* not likely to happen at all */
        .list > .col-md-3.listelement-large-image h1 {font-size: 1rem;}
        .list > .col-md-4.listelement-large-image h1 {font-size: 1.2rem;}
        .list > .col-md-6.listelement-large-image h1 {font-size: 1.4rem;}
        .list > .col-md-12.listelement-large-image h1 {font-size: 1.6rem;}/* one column full width */
    }

    @media (min-width:991px) {
        .list > .col-lg-2.listelement-large-image h1 {font-size: 1rem;}/* not likely to happen */
        .list > .col-lg-3.listelement-large-image h1 {font-size: 1.1rem;}
        .list > .col-lg-4.listelement-large-image h1 {font-size: 1.2rem;}
        .list > .col-lg-6.listelement-large-image h1 {font-size: 1.4rem;}
        .list > .col-lg-12.listelement-large-image h1 {font-size: 1.6rem;}/* one column full width */
    }

    @media (min-width:1200px) {
        .list > .col-xl-2.listelement-large-image h1 {font-size: 1rem;}
        .list > .col-xl-3.listelement-large-image h1 {font-size: 1.4rem;}
        .list > .col-xl-4.listelement-large-image h1 {font-size: 1.6rem;}
        .list > .col-xl-6.listelement-large-image h1 {font-size: 1.6rem;}
        .list > .col-xl-12.listelement-large-image h1 {font-size: 2rem;}/* one column full width */
    }

    /* Small image */
    .list > .col-2.listelement-small-image h1 {font-size: 0.6rem;} /* not likely to happen at all */ /* Same as karge image */
    .list > .col-3.listelement-small-image h1 {font-size: 0.8rem;} /* not likely to happen at all */ /* Same as karge image */
    .list > .col-4.listelement-small-image h1 {font-size: 1rem;} /* not likely to happen */ /* Same as karge image */
    .list > .col-6.listelement-small-image h1 {font-size: 1.2rem;} /* Same as karge image */
    .list > .col-12.listelement-small-image h1 {font-size: 1.4rem;}/* one column full width */

    @media (min-width:576px) {
        .list > .col-sm-2.listelement-small-image h1 {font-size: 0.6rem;} /* not likely to happen at all */
        .list > .col-sm-3.listelement-small-image h1 {font-size: 1rem;}
        .list > .col-sm-4.listelement-small-image h1 {font-size: 1.2rem;}
        .list > .col-sm-6.listelement-small-image h1 {font-size: 1.4rem;}
        .list > .col-sm-12.listelement-small-image h1 {font-size: 1.6rem;} /* one column full width */
        }

    @media (min-width:768px) {
        .list > .col-md-2.listelement-small-image h1 {font-size: 0.6rem;} /* not likely to happen at all */
        .list > .col-md-3.listelement-small-image h1 {font-size: 1rem;}
        .list > .col-md-4.listelement-small-image h1 {font-size: 1.2rem;}
        .list > .col-md-6.listelement-small-image h1 {font-size: 1.4rem;}
        .list > .col-md-12.listelement-small-image h1 {font-size: 1.6rem;} /* one column full width */
        }

    @media (min-width:991px) {
        .list > .col-lg-2.listelement-small-image h1 {font-size: 0.8rem;}/* not likely to happen at all */
        .list > .col-lg-3.listelement-small-image h1 {font-size: 1rem;}/* not likely to happen at all */
        .list > .col-lg-4.listelement-small-image h1 {font-size: 1.1rem;}/* not likely to happen */
        .list > .col-lg-6.listelement-small-image h1 {font-size: 1.2rem;}
        .list > .col-lg-12.listelement-small-image h1 {font-size: 1.6rem;}/* one column full width */
        }

    @media (min-width:1200px) {
        .list > .col-xl-2.listelement-small-image h1 {font-size: 1rem;}/* not likely to happen */
        .list > .col-xl-3.listelement-small-image h1 {font-size: 1.1rem;}/* not likely to happen */
        .list > .col-xl-4.listelement-small-image h1 {font-size: 1.2rem;}/* not likely to happen */
        .list > .col-xl-6.listelement-small-image h1 {font-size: 1.4rem;}
        .list > .col-xl-12.listelement-small-image h1 {font-size: 1.6rem;}
    }


/*
=======================================================================
	13.2 Employee list
=======================================================================
*/

    .listelement-employee {
        font-size: 0.85em;
        letter-spacing: 1px;
        }

    .listelement-employee article figure { /*max-width:50%;*/
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 1rem;
        }

    .list .listelement-employee article h3 {
        margin-bottom: 0 !important;
        font-weight: bold !important;
        }

    .listelement-employee article .text > * {margin: 0;}
    .listelement-employee article .text a {display: inline-block;}
    .listelement-employee article .employee-position {margin: .5rem 0;}
    .listelement-employee article .employee-email.email-overflow a span {display: none;}
    .listelement-employee article .employee-email.email-overflow a:before {content: "Send e-post";}

    .listelement-employee h1 {font-size:1.3em;}


/*
=======================================================================
	14. Target Last Same Width Row in Grid (Beta)
=======================================================================
*/

    [class*="listelement-"] {margin-bottom: 40px;}

    @media (max-width:575px) {
        .list > .col-12:nth-child(1n+1):nth-last-child(-n+1),
        .list > .col-12:nth-child(1n+1):nth-last-child(-n+1) ~ .col-12,
        .list > .col-6:nth-child(2n+1):nth-last-child(-n+2),
        .list > .col-6:nth-child(2n+1):nth-last-child(-n+2) ~ .col-6,
        .list > .col-4:nth-child(3n+1):nth-last-child(-n+3),
        .list > .col-4:nth-child(3n+1):nth-last-child(-n+3) ~ .col-4,
        .list > .col-3:nth-child(4n+1):nth-last-child(-n+4),
        .list > .col-3:nth-child(4n+1):nth-last-child(-n+4) ~ .col-3,
        .list > .col-2:nth-child(6n+1):nth-last-child(-n+6),
        .list > .col-2:nth-child(6n+1):nth-last-child(-n+6) ~ .col-2 {
            margin-bottom: 0 !important;
        }
    }

    @media (min-width:576px) and (max-width:767px) {
        .list > .col-sm-12:nth-child(1n+1):nth-last-child(-n+1),
        .list > .col-sm-12:nth-child(1n+1):nth-last-child(-n+1) ~ .col-sm-12,
        .list > .col-sm-6:nth-child(2n+1):nth-last-child(-n+2),
        .list > .col-sm-6:nth-child(2n+1):nth-last-child(-n+2) ~ .col-sm-6,
        .list > .col-sm-4:nth-child(3n+1):nth-last-child(-n+3),
        .list > .col-sm-4:nth-child(3n+1):nth-last-child(-n+3) ~ .col-sm-4,
        .list > .col-sm-3:nth-child(4n+1):nth-last-child(-n+4),
        .list > .col-sm-3:nth-child(4n+1):nth-last-child(-n+4) ~ .col-sm-3,
        .list > .col-sm-2:nth-child(6n+1):nth-last-child(-n+6),
        .list > .col-sm-2:nth-child(6n+1):nth-last-child(-n+6) ~ .col-sm-2 {
            margin-bottom: 0 !important;
        }
    }

    @media (min-width:768px) and (max-width:991px) {
        [class*="listelement-"] {margin-bottom: 50px;}

        .list > .col-md-12:nth-child(1n+1):nth-last-child(-n+1),
        .list > .col-md-12:nth-child(1n+1):nth-last-child(-n+1) ~ .col-md-12,
        .list > .col-md-6:nth-child(2n+1):nth-last-child(-n+2),
        .list > .col-md-6:nth-child(2n+1):nth-last-child(-n+2) ~ .col-md-6,
        .list > .col-md-4:nth-child(3n+1):nth-last-child(-n+3),
        .list > .col-md-4:nth-child(3n+1):nth-last-child(-n+3) ~ .col-md-4,
        .list > .col-md-3:nth-child(4n+1):nth-last-child(-n+4),
        .list > .col-md-3:nth-child(4n+1):nth-last-child(-n+4) ~ .col-md-3,
        .list > .col-md-2:nth-child(6n+1):nth-last-child(-n+6),
        .list > .col-md-2:nth-child(6n+1):nth-last-child(-n+6) ~ .col-md-2 {
            margin-bottom: 0 !important;
        }
    }

    @media (min-width:992px) and (max-width:1199px) {
        [class*="listelement-"] {margin-bottom: 60px;}

        .list > .col-lg-12:nth-child(1n+1):nth-last-child(-n+1),
        .list > .col-lg-12:nth-child(1n+1):nth-last-child(-n+1) ~ .col-lg-12,
        .list > .col-lg-6:nth-child(2n+1):nth-last-child(-n+2),
        .list > .col-lg-6:nth-child(2n+1):nth-last-child(-n+2) ~ .col-lg-6,
        .list > .col-lg-4:nth-child(3n+1):nth-last-child(-n+3),
        .list > .col-lg-4:nth-child(3n+1):nth-last-child(-n+3) ~ .col-lg-4,
        .list > .col-lg-3:nth-child(4n+1):nth-last-child(-n+4),
        .list > .col-lg-3:nth-child(4n+1):nth-last-child(-n+4) ~ .col-lg-3,
        .list > .col-lg-2:nth-child(6n+1):nth-last-child(-n+6),
        .list > .col-lg-2:nth-child(6n+1):nth-last-child(-n+6) ~ .col-lg-2 {
            margin-bottom: 0 !important;
        }
    }

    @media (min-width:1200px) {
        [class*="listelement-"] {margin-bottom: 60px;}

        .list > .col-xl-12:nth-child(1n+1):nth-last-child(-n+1),
        .list > .col-xl-12:nth-child(1n+1):nth-last-child(-n+1) ~ .col-xl-12,
        .list > .col-xl-6:nth-child(2n+1):nth-last-child(-n+2),
        .list > .col-xl-6:nth-child(2n+1):nth-last-child(-n+2) ~ .col-xl-6,
        .list > .col-xl-4:nth-child(3n+1):nth-last-child(-n+3),
        .list > .col-xl-4:nth-child(3n+1):nth-last-child(-n+3) ~ .col-xl-4,
        .list > .col-xl-3:nth-child(4n+1):nth-last-child(-n+4),
        .list > .col-xl-3:nth-child(4n+1):nth-last-child(-n+4) ~ .col-xl-3,
        .list > .col-xl-2:nth-child(6n+1):nth-last-child(-n+6),
        .list > .col-xl-2:nth-child(6n+1):nth-last-child(-n+6) ~ .col-xl-2 {
            margin-bottom: 0 !important;
        }
    }

    .row.list > [class*="col-"]:last-child {
        margin-bottom: 0 !important;
    }


/*
=======================================================================
	15. Search result
=======================================================================
*/

    #searchlist h2 {
        margin-bottom: 4rem;
    }

    .section-searchresult .searchresult-filter input[type="checkbox"] {
        margin-right: 10px;
    }

    .section-searchresult .searchresult-filter input[type="checkbox"]:hover,
    .section-searchresult .searchresult-filter label:hover {
        cursor: pointer;
    }

    .listelement-search-result:last-child {
        border-bottom: 0;
    }

    .listelement-search-result h3 {
        margin: 0;
        padding: 0;
    }

    .listelement-search-result p {
        margin: 0;
        padding: 0;
    }

    .searchresult-category {
        margin: 0;
        padding: 0;
        display: none;
    }

    .searchresult-category span {
        font-weight: 500;
    }


/*
=======================================================================
    15.1 Search result filter
=======================================================================
*/

.section-search input[type="checkbox"], .section-search input[type="radio"] {
    margin-right: 10px;
    }


    /*
=======================================================================
	16. White (if white on dark background)
=======================================================================
*/

    .white p,
    .white div,
    .white h1,
    .white h2,
    .white h3,
    .white h4,
    .white h5,
    .white h6 {
        color: white;
    }

    .white blockquote {
        border-left: 5px solid #fff;
    }

    .white a {
        color: #fff;
        text-decoration: none;
    }

        .white a:focus,
        .white a:hover {
            color: #fff;
            text-decoration: underline;
        }

    .white article a {
        color: #fff;
        text-decoration: underline;
    }

    .white a ~ a {
        text-decoration: none;
    }

    .white div[class^="listelement-"] ~ a:hover,
    .white a:hover {
        text-decoration: underline;
    }

    .white a ~ a:hover {
        text-decoration: underline;
    }

    .white select {
        color: #555; /* Tekst inni selectboksene skal fortsatt være mørk */
    }

    .white span {
    }


/*
=======================================================================
	17. Form
=======================================================================
*/

    .form-group {
        position: relative;
        margin-bottom: 30px;
    }

    .form-group:last-child {
        position: relative;
        margin-bottom: 0;
    }

    .input-group input,
    .input-group button {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
    }

.fileinput-button:after {
    font-family: "Font Awesome 5 Pro";
    content: "\f07c";
    display: inline-block;
}

.ui-state-error {
    border: 1px solid #c33 !important;
}

    .ui-state-highlight {
        background-color: #ffa;
    }

    .validateTips {
        padding: 10px 0;
        line-height: 1.8em;
    }

        .validateTips em {
            font-weight: 700;
        }

    .required {
        color: #F00;
        font-size: 1.3em;
        font-weight: 300;
    }

    .has-error + .help-block.validation-block {
        color: #fff;
        padding: .6rem 1rem;
        background: #a94442;
        display: inline-block;
        animation-duration: .8s;
        animation-name: fadeIn;
    }

        .has-error + .help-block.validation-block:before {
            font-family: "Font Awesome 5 Pro";
            content: "\f05a";
            margin-right: 10px;
            display: inline-block;
        }

    @keyframes fadeIn {
        0% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    .form-field {
        position: relative;
    }

        .form-field.has-success input {
            border: 1px solid #5bb12f;
            border: 1px solid #5bb12f;
        }

        .form-field div[class*="col-"].has-error + div[class*="col-"] input {
            border: 1px solid #a94442;
        }

        .form-field.has-success:after,
        .form-field.has-error:after {
            position: absolute;
            top: 50%;
            -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            transform: translateY(-50%);
            right: 15px;
            animation-duration: .8s;
            animation-name: bounceIn;
        }

    @keyframes bounceIn {
        0% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }


    /* Success icon */
    .form-field.has-success:after {
        font-family: "Font Awesome 5 Pro";
        content: "\f164";
        color: #5bb12f;
    }

    /* Error icon */
    .form-field.has-error:after {
        font-family: "Font Awesome 5 Pro";
        content: "\f165";
        color: #c33;
    }



    @media (max-width: 767px) {
        .form-group {
            margin-bottom: 20px;
        }
    }


/*
=======================================================================
	17.1 Custom Checkbox and Radio
=======================================================================
*/

.radio + .radio,
.checkbox + .checkbox {margin-top:10px;}


.radio:last-of-type, .checkbox:last-of-type {
    margin-bottom: 0;
}

.radio label,
.checkbox label {
    position: relative;
    padding-left: 30px;
    margin-bottom:0;
}

.radio label:hover,
.checkbox label:hover {
    cursor:pointer;
}

/* Checkbox */

.checkbox input[type=checkbox] {
    display: none;
}
/* to hide the checkbox itself */
.checkbox input[type=checkbox] + label:before {
    font-family: "Font Awesome 5 Pro";
    display: inline-block;
    content: "\f0c8";
    position: absolute;
    left: 0;
}

.checkbox input[type=checkbox]:checked + label:before {
    content: "\f14a";
} /* checked icon */


/* Radio */
.radio input[type=radio] {
    display: none;
}
/* to hide the checkbox itself */
.radio input[type=radio] + label:before {
    font-family: "Font Awesome 5 Pro";
    display: inline-block;
    content: "\f111";
    position: absolute;
    left: 0;
}

.radio input[type=radio]:checked + label:before {
    content: "\f058";
} /* checked icon */

.radio input[type=radio]:checked + label:before {
    letter-spacing: 5px;
} /* allow space for check mark */


/*
=======================================================================
	18. Misc
=======================================================================
*/

.one-line {
white-space: nowrap;
width: 100%;
overflow: hidden;
-o-text-overflow: ellipsis;
-ms-text-overflow: ellipsis;
text-overflow: ellipsis;
height: 1.3em;
}

.center {text-align: center !important;}
.center img {margin: auto;}.right {text-align: right !important;}
.left {text-align: left !important;}
.push-bottom {margin-bottom: 35px;}
.push-top {margin-top: 35px;}


/*
=======================================================================
	20. Site Sub footer
=======================================================================
*/

.sub-footer {
    padding: 30px 0;
    border-top: 1px solid rgba(255,255,255,0.15);
    font-weight: lighter;
    font-size:0.8em;
    color:#b3b3b3;
    background-color: rgba(var(--themecolor), 1);
    }

.sub-footer,
.sub-footer a {
    color:#b3b3b3;
    }


@media (min-width:768px) {
    .sub-footer .copyright {float: left;}
    .sub-footer .credits {float: right;}
    }


/*
=======================================================================
	21. Calendar
=======================================================================
*/

.listelement-calendar,
.listelement-calendar-date {margin-bottom:1.5rem;}

.listelement-calendar-date .date {
    text-align:center;width:80px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

.listelement-calendar-date .date > * {line-height:normal;}
.listelement-calendar-date .date__day {font-size:.8em;padding:7px 0;text-transform:uppercase;background: rgb(var(--themecolor));color:#fff;}
.listelement-calendar-date .date__date {font-size:1.8em;font-weight:bold;}
.listelement-calendar-date .date__month {font-size:.8em;uppercase;}

.listelement-calendar-date + .listelement-calendar-date .listelement-calendar-date-wrapper {border-top: 1px solid rgb(0,0,0,0.1);padding-top:1.5rem;}

.listelement-calendar-date:last-child .listelement-calendar-date-wrapper {border-bottom: none;}

.listelement-calendar-date .calendar-event-dateinfo:not(:empty) {font-size:0.9em;margin-bottom:4px;}
.listelement-calendar-date .calendar-event-dateinfo.hastime:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f017";
    margin-right: 1px;
}

.listelement-calendar-date h3 {font-weight:bold;font-size:1.35em;margin:0;padding:0;display:inline-block;margin-bottom:0.5rem;}
.listelement-calendar-date .read-more {display:none;}
.listelement-calendar-date .calendar-event-hasinfo .read-more {margin-bottom:0.5rem;display:block;color:rgb(var(--themecolor));}
.listelement-calendar-date .calendar-event-hasinfo .read-more span {display:none;}
.listelement-calendar-date .calendar-event-hasinfo[aria-expanded="false"] .show-info {display:inline;}
.listelement-calendar-date .calendar-event-hasinfo[aria-expanded="true"] .hide-info {display:inline;}
.listelement-calendar-date .calendar-event-hasinfo[aria-expanded="true"] h3 {}
.listelement-calendar-date .calendar-event-hasinfo .read-more:after {
        font-family: "Font Awesome 5 Pro";
        content: "\f067";
        margin-left: 10px;
        color:rgb(var(--themecolor));
        font-weight:lighter;
}

.listelement-calendar-date .calendar-event-hasinfo[aria-expanded="true"] .read-more:after {
    content: "\f00d";
}




.listelement-calendar-date * {line-height:normal;}

@media (min-width:991px) {
    .listelement-calendar-date-wrapper {display:table;width:100%;}
    .listelement-calendar-date-wrapper > * {display:table-cell;vertical-align:top;}
    .listelement-calendar-date-box {padding-right:30px;}
    .listelement-calendar-date-content {width:100%;}
}

.calendar-event-header h3 {font-weight:normal;font-size:1.45em;margin:0!important;padding:0;display:inline-block;}

.calendar-event-title a:not(.calendar-event-hasinfo) {pointer-events:none;}

.listelement-calendar-event {
    margin-bottom:1.5rem;
    padding: 1rem;
    background: #00000008;
}
.listelement-calendar-event .bttn {
    margin-top:15px;
    background-color:rgb(var(--themecolor));color:#fff;
    border-color:rgb(var(--themecolor));
}

@media (min-width:991px) {
    .listelement-calendar-event {display:table;width:100%;}
    .listelement-calendar-event > * {display:table-cell;vertical-align:top;}
    .listelement-calendar-event .bttn {float:right;margin-top:0;margin-bottom:0;}

}

.listelement-calendar-event .bttn:focus,
.listelement-calendar-event .bttn:hover {
    background-color:rgb(var(--themecolor-hover));color:#fff;
    border-color:rgb(var(--themecolor-hover));
}


/*
=======================================================================
	21.1 Calendar Template 1
=======================================================================
*/

    .calendar-template1 .calendar-date {
        margin-bottom: 0.7em;
    }

        .calendar-template1 .calendar-date div[class*="calendar-date-"],
        .calendar-template1 .calendar-date div[class*="calendar-start-"],
        .calendar-template1 .calendar-date div[class*="calendar-end-"] {
            display: inline-block;
        }

        .calendar-template1 .calendar-date div[class*="calendar-date-"] {
            margin-right: 15px;
        }


    /* Date */
    .calendar-template1 .calendar-start-day:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f017";
        margin-right: 10px;
        display: inline-block;
    }

    .calendar-template1 .calendar-start-day,
    .calendar-template1 .calendar-end-day {
        font-size: .9em;
        font-weight: normal;
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    .calendar-template1 .calendar-start-date,
    .calendar-template1 .calendar-end-date {
        font-size: .9em;
        font-weight: bold;
        text-transform: uppercase;
    }

    .calendar-template1 .calendar-start-time,
    .calendar-template1 .calendar-end-time {
        font-size: .9em;
        font-weight: normal;
        text-transform: uppercase;
    }

    /* Text */
    .calendar-template1 .calendar-text h3 {
        font-size: 1.1em;
        margin: 0 !important;
    }

    .calendar-template1 .calendar-text-items > * {
        margin-bottom: 2rem;
    }

    .calendar-template1 .calendar-text-items > :last-child {
        margin-bottom: 0;
    }

    .calendar-template1 .listelement-calendarlist .calendar-text > :last-child {
        margin-bottom: 0;
    }

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

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

    @media (min-width: 1200px) {
        .calendar-template1 .listelement-calendarlist {
            margin-bottom: 40px !important;
        }

        .calendar-template1 .calendar-date-wrapper {
            padding: 0 .5rem;
        }

        .calendar-template1 .calendar-date div[class*="calendar-date-"] {
            margin: auto;
        }

        .calendar-template1 .calendar-start-day:before {
            content: "";
        }

        .calendar-template1 .calendar-date {
            display: flex;
            text-align: center;
        }

            .calendar-template1 .calendar-date > * {
                align-self: center;
                margin-right: 15px;
            }

            .calendar-template1 .calendar-date > :last-child {
                margin-right: 0;
            }

        .calendar-template1 .calendar-text {
            border-left: 2px solid #e0e0e0;
            padding-left: 2rem;
        }
    }

/*
=======================================================================
	21.2 Calendar Template 2
=======================================================================
*/

    .calendar-template2 .calendar-date {
        margin-bottom: 0.7em;
    }

        .calendar-template2 .calendar-date div[class*="calendar-date-"],
        .calendar-template2 .calendar-date div[class*="calendar-start-"],
        .calendar-template2 .calendar-date div[class*="calendar-end-"] {
            display: inline-block;
        }

        .calendar-template2 .calendar-date div[class*="calendar-date-"] {
            margin-right: 15px;
        }

    /* Date */
    .calendar-template2 .calendar-start-day:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f017";
        margin-right: 10px;
        display: inline-block;
    }

    .calendar-template2 .calendar-start-day,
    .calendar-template2 .calendar-end-day {
        font-size: .9em;
        font-weight: normal;
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    .calendar-template2 .calendar-start-date,
    .calendar-template2 .calendar-end-date {
        font-size: .9em;
        font-weight: bold;
        text-transform: uppercase;
    }

    .calendar-template2 .calendar-start-time,
    .calendar-template2 .calendar-end-time {
        font-size: .9em;
        font-weight: normal;
        text-transform: uppercase;
    }

    /* Text */
    .calendar-template2 .calendar-text h3 {
        font-size: 1.1em;
        margin: 0 !important;
    }

    .calendar-template2 .calendar-text-items > * {
        margin-bottom: 2rem;
    }

    .calendar-template2 .calendar-text-items > :last-child {
        margin-bottom: 0;
    }

    .calendar-template2 .listelement-calendarlist .calendar-text > :last-child {
        margin-bottom: 0;
    }

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

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

    @media (min-width: 1200px) {
        .calendar-template2 .listelement-calendarlist {
            margin-bottom: 40px !important;
        }

        .calendar-template2 .calendar-date-wrapper {
            padding: 0 .5rem;
        }

        .calendar-template2 .calendar-date div[class*="calendar-date-"] {
            margin: auto;
        }

        .calendar-template2 .calendar-start-day:before {
            content: "";
        }

        .calendar-template2 .calendar-date {
            display: flex;
            text-align: center;
        }

            .calendar-template2 .calendar-date > * {
                align-self: center;
                margin-right: 15px;
            }

            .calendar-template2 .calendar-date > :last-child {
                margin-right: 0;
            }

        .calendar-template2 .calendar-text-items {
            border-left: 2px solid #e0e0e0;
            padding-left: 2rem;
        }
    }


    /*
=======================================================================
	21.3 Calendar Template 3
=======================================================================
*/

    .calendar-template3 .calendar-date {
        margin-bottom: 0.7em;
    }

        .calendar-template3 .calendar-date div[class*="calendar-date-"],
        .calendar-template3 .calendar-date div[class*="calendar-start-"],
        .calendar-template3 .calendar-date div[class*="calendar-end-"] {
            display: inline-block;
        }

        .calendar-template3 .calendar-date div[class*="calendar-date-"] {
            margin-right: 15px;
        }


    /* Date */
    .calendar-template3 .calendar-start-day:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f017";
        margin-right: 10px;
        display: inline-block;
    }

    .calendar-template3 .calendar-start-day,
    .calendar-template3 .calendar-end-day {
        font-size: .9em;
        font-weight: normal;
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    .calendar-template3 .calendar-start-date,
    .calendar-template3 .calendar-end-date {
        font-size: .9em;
        font-weight: bold;
        text-transform: uppercase;
    }

    .calendar-template3 .calendar-start-time,
    .calendar-template3 .calendar-end-time {
        font-size: .9em;
        font-weight: normal;
        text-transform: uppercase;
    }

    /* Text */
    .calendar-template3 .calendar-text h3 {
        font-size: 1.1em;
        margin: 0 !important;
    }

    .calendar-template3 .calendar-text-items > * {
        margin-bottom: 2rem;
    }

    .calendar-template3 .calendar-text-items > :last-child {
        margin-bottom: 0;
    }

    .calendar-template3 .listelement-calendarlist .calendar-text > :last-child {
        margin-bottom: 0;
    }

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

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

    @media (min-width: 1200px) {
        .calendar-template3 .listelement-calendarlist {
            margin-bottom: 40px !important;
        }

        .calendar-template3 .calendar-date-wrapper {
            padding: 0 .5rem;
        }

        .calendar-template3 .calendar-date div[class*="calendar-date-"] {
            margin: auto;
        }

        .calendar-template3 .calendar-start-day:before {
            content: "";
        }

        .calendar-template3 .calendar-date {
            display: flex;
            text-align: center;
        }

            .calendar-template3 .calendar-date > * {
                align-self: center;
                margin-right: 15px;
            }

            .calendar-template3 .calendar-date > :last-child {
                margin-right: 0;
            }

        .calendar-template3 .calendar-text-items {
            border-left: 2px solid #e0e0e0;
            padding-left: 2rem;
        }
    }


/*
=======================================================================
	40. Element Feedback
=======================================================================
*/

    .feedback-options {
        margin: 0;
        padding: 0;
        list-style: none;
    }

        .feedback-options li {
            margin: 0;
            padding: 0;
            display: block;
            float: left;
            width: 50%;
            text-align: center;
        }

            .feedback-options li:first-child {
                margin: 0;
            }

            .feedback-options li a {
                display: inline-block;
                padding: 1rem;
                color: #333;
                opacity: 0.8;
                -webkit-transition: all 0.3s ease;
                -moz-transition: all 0.3s ease;
                -o-transition: all 0.3s ease;
                -ms-transition: all 0.3s ease;
                transition: all 0.3s ease;
            }

                .feedback-options li a:hover {
                    text-decoration: none;
                    opacity: 1;
                    transform: scale(1.05);
                }

            .feedback-options li figure {
                margin: 0;
            }

                .feedback-options li figure img {
                    max-width: 50px;
                    margin: 0 auto 0.7rem auto;
                }

            .feedback-options li figcaption {
                text-align: center;
                font-size: .9rem;
            }

    .feedback-wrapper {
        display: table;
        width: 100%;
        height: 100%;
    }

        .feedback-wrapper h3 {
            text-align: center;
        }

    .feedback-wrapper-inner {
        display: table-cell;
        vertical-align: middle;
    }


    @media (min-width: 768px) {
        .feedback-options li {
            width: 25%;
        }

        .feedback-wrapper h3 {
            text-align: left;
        }
    }

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

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


/*
=======================================================================
	41. Element Imagebanner
=======================================================================
*/

.imagebanner img {
    width: 100%;
    }


/*
=======================================================================
	42. Element Right and Left Content - Text and Image
=======================================================================
*/

    .text-and-image {
        position: relative;
        overflow: hidden;
    }

    /*.text-and-image .image-content-xs {margin-bottom: 1.5rem;}*/

    .module-fullwidth .text-and-image.text-and-image-text-right .text-content {padding-right: 0;}
    .module-fullwidth .text-and-image.text-and-image-text-left .text-content {padding-left: 0;}

    .text-and-image .image-content {height: 100%;}
    .text-and-image .image-content-xl {display: none;}

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

        .text-and-image:not(.nobg) .image-content-xs {display: none;}

        .text-and-image .image-content-xs {width:50%;margin-bottom:0;}
        .text-and-image .image-content-xl {display: block;}

        /* Ordinary img */
        .text-and-image .image-content-inner-inner {
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%); /* Safari */
            -ms-transform: translate(-50%, -50%); /* IE 9 */
            transform: translate(-50%, -50%);
            max-width: 100%;
            max-height: 100%;
        }

        /* Background img */
        .text-and-image .image-content {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            height: 100%;
            width: 50%;
            z-index: 3;
            background-repeat: no-repeat;
            background-position: center center;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            margin-top: 0;
        }

        .text-and-image-text-right .col-md-6 {
            float: right;
        }

        .text-and-image-text-right .image-content {
            left: 0;
            right: auto;
        }

        .text-and-image .text-content {
            padding-left: 0;
            padding-right: 0;
        }
        .module-fullwidth .text-and-image.text-and-image-text-right .text-content {
            padding-left: 2rem;
        }

        .text-and-image.nobg .image-content-xl  {
            display:none;
        }

        .text-and-image.nobg .container {
            display: flex;
            align-items: center;
        }

        .text-and-image.nobg.valigntop .container {
            align-items: flex-start;
        }

        .text-and-image.nobg.valignbottom .container {
            align-items: flex-end;
        }

        .text-and-image.nobg.text-and-image-text-left .container {
            flex-direction: row-reverse;
        }
    }

    @media screen and (min-width: 991px) {
        .module-fullwidth .text-and-image.text-and-image-text-right .text-content {
            padding-left: 3rem;
        }
    }

    @media screen and (min-width: 1200px) {
        .text-and-image .text-content .colteaser {font-weight: 400;}
        .text-and-image .text-content .pretitle {margin-left: 0;}
        .text-and-image h2 {font-size: 3rem;font-weight:bold;}
        .text-and-image .text-content .colteaser {font-size: 1.1em;}
    }


/*
=======================================================================
	42.1 Element Right and Left Content Padding
=======================================================================
*/

    .text-and-image.elementtopspace1 {margin-top: var(--default-margin-1);} 
    .text-and-image.elementtopspace2 {margin-top: var(--default-margin-2);} 
    .text-and-image.elementtopspace3 {margin-top: var(--default-margin-3);}
    .text-and-image.elementtopspace4 {margin-top: var(--default-margin-4);}

    .text-and-image.elementbottomspace1 {margin-bottom: var(--default-margin-1);} 
    .text-and-image.elementbottomspace2 {margin-bottom: var(--default-margin-2);} 
    .text-and-image.elementbottomspace3 {margin-bottom: var(--default-margin-3);}
    .text-and-image.elementbottomspace4 {margin-bottom: var(--default-margin-4);}

    .text-and-image.contenttopspace0 .text-content {padding-top: var(--default-margin-0);}
    .text-and-image.contenttopspace1 .text-content {padding-top: var(--default-margin-1);} 
    .text-and-image.contenttopspace2 .text-content {padding-top: var(--default-margin-2);} 
    .text-and-image.contenttopspace3 .text-content {padding-top: var(--default-margin-3);}
    .text-and-image.contenttopspace4 .text-content {padding-top: var(--default-margin-4);}

    .text-and-image.contentbottomspace0 .text-content {padding-bottom: var(--default-margin-0);}
    .text-and-image.contentbottomspace1 .text-content {padding-bottom: var(--default-margin-1);}
    .text-and-image.contentbottomspace2 .text-content {padding-bottom: var(--default-margin-2);}
    .text-and-image.contentbottomspace3 .text-content {padding-bottom: var(--default-margin-3);}
    .text-and-image.contentbottomspace4 .text-content {padding-bottom: var(--default-margin-4);}


@media screen and (min-width: 577px) {
    .text-and-image.module-fullwidth .image-content-xs {padding-top: var(--default-margin-2);}
}

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

    .text-and-image .text-content {padding-top:1.5rem!important;}
    .text-and-image .text-content {padding-top:1.5rem!important;}

    .text-and-image .text-content {padding:var(--default-margin-2);padding-top: calc((var(--default-margin-2) / 2));}
    .text-and-image.module-fullwidth.background.text-and-image-text-left .text-content {padding-left: 15px;padding-right:15px;}
    .text-and-image.module-fullwidth.background.text-and-image-text-right .text-content {padding-left: 15px;padding-right:15px;}
    .text-and-image.module-fullwidth:not(.background) .image-content-xs {padding-top: 0;}
}

    @media screen and (min-width: 768px) {
        .text-and-image.background .text-content {
            padding-left:var(--default-margin-2);
            padding-right:var(--default-margin-2);
        } 

        .text-and-image.text-and-image-text-right:not(.background) .text-content {padding-left:var(--default-margin-2);} 
        .text-and-image.text-and-image-text-left:not(.background) .text-content {padding-right:var(--default-margin-2);} 

        .text-and-image.module-fullwidth.text-and-image-text-left .text-content {padding-left: 0;}
        .text-and-image.module-fullwidth.text-and-image-text-right .text-content {padding-right: 0;}
    }


@media screen and (max-width: 576px) {
    .text-and-image .text-content {padding-top:1.5rem!important;padding-left: 30px;padding-right: 30px;}
    .text-and-image.background .text-content {padding-bottom: 30px;}

    .text-and-image:not(.background) .text-content {padding-left: 15px;padding-right: 15px;padding-bottom: 15px;}
    .text-and-image.background.module-fullwidth .image-content-xs {padding-left:15px;padding-right:15px;padding-top:30px;}
}


/*
=======================================================================
	42.2 Element Right and Left Content Width
=======================================================================
*/

    .text-and-image .column {
        position: relative;
        min-height: 1px;
        float: left;
    }

    .text-and-image-text-right .column {
        float: right;
    }

    @media (min-width: 767px) {

        .text-and-image .column {
            width:50%;
        }

/*
=======================================================================
	42.3 Element Right and Left Content w/ Background Color
=======================================================================
*/

@media (max-width: 767px) {
    /*.text-and-image.background-color > .container {max-width:100%;padding:0;}*/
    .text-and-image.background-color {margin-top:0;padding-bottom:40px;background-color:transparent!important;}
    .text-and-image.background-color .column {float:none;}    
    .text-and-image.background-color .image-content-xs {margin-bottom:0;}
    .text-and-image.background-color .text-content {padding:30px 0;}
    }

@media (min-width: 768px) {
    .text-and-image.background-color .text-content > .container {padding:0;}
    }


/*
=======================================================================
	43. Accordion
=======================================================================
*/

.accordion-item {
	border:0;
	margin-bottom:15px;
	padding-bottom:10px;
	-webkit-transition: all 0.3s ease;                  
	-moz-transition: all 0.3s ease;                 
	-o-transition: all 0.3s ease;   
	-ms-transition: all 0.3s ease;          
	transition: all 0.3s ease;	
    }

.accordion-item-header h3 {
	color:#000;
    margin:0;
}

.accordion-item-header-link h3:before {
	font-family: "Font Awesome 5 Pro";
	content: "\f175";
	margin-right: 10px;
	display:inline-block;
	-webkit-transition: all 0.3s ease;                  
	-moz-transition: all 0.3s ease;                 
	-o-transition: all 0.3s ease;   
	-ms-transition: all 0.3s ease;          
	transition: all 0.3s ease;	
	color: #890d5f;
}

.accordion-item-header-link[aria-expanded="true"] h3:before {transform: rotate(180deg)}	

.accordion-item-header-link {
    border:0;
    background:none;
    padding:0;
    width:100%;
    text-align:left;
}

.accordion-item-header-link:focus {
    outline:0;
}

.accordion-item-body {padding-top:15px;}


/*
=======================================================================
	44. Timeline Vertical
=======================================================================
*/

.timeline-header {
	padding: 2.5rem 1.5rem;
	text-align: center;
	}

.timeline ul {
	padding-left:0;
	}

.timeline ul li {
    list-style-type: none;
    position: relative;
    width: 4px;
    margin: 0 auto;
    background: #000;
    padding-top: 20px;
    padding-bottom: 20px;
}
.timeline ul li::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 50%;
    transform: translateX(-50%) translateY(50%);
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #000;
}

.timeline ul li .timeline-item {
    position: relative;
    bottom: 0;
    width: 400px;
    padding: 15px;
    background: white;
    left: 397px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    font-size: 1rem;
}

.timeline ul li .timeline-item.text--white {
    color:#fff;
}

.timeline ul li .timeline-item::before {
    content: '';
    position: absolute;
    border: 1px solid #000;
    width: 32px;
    top: 50%;
}
.timeline ul li:nth-child(odd) div {
    left: 45px;
}
.timeline ul li:nth-child(odd) div::before {
    left: -32px;
}
.timeline ul li:nth-child(even) div {
    left: -439px;
}
.timeline ul li:nth-child(even) div::before {
    right: -32px;
}
.timeline ul li h3 {
    text-transform: uppercase;
}
.timeline ul li::after {
    transition: background .5s ease-in-out;
}
.timeline ul li.in-view::after {
    background: white;
    border: 2px solid #000;
}
.timeline ul li .timeline-item {
    visibility: hidden;
    opacity: 0;
    transition: all .5s ease-in-out;
}
.timeline ul li:nth-child(odd) div {
    transform: translate3d(200px, 0, 0);
}
.timeline ul li:nth-child(even) div {
    transform: translate3d(-200px, 0, 0);
}
.timeline ul li.in-view div {
    transform: none;
    visibility: visible;
    opacity: 1;
}

@media screen and (max-width: 900px) {
  .timeline ul li .timeline-item {
    width: 250px;
  }
  .timeline ul li:nth-child(even) div {
    left: -289px;
    /*250+45-6*/
  }
	.timeline {
		overflow:hidden;
	}		
}

@media screen and (max-width: 600px) {
    .timeline ul li {
        margin-left: 20px;
    }
    .timeline ul li .timeline-item {
        width: calc(100vw - 160px);
    }
    .timeline ul li:nth-child(even) div {
        left: 45px;
    }
    .timeline ul li:nth-child(even) div::before {
        left: -32px;
    }
}



/*
=======================================================================
	97. Rotating Elements
=======================================================================
*/

.listelement-rotating-element:not(.white) .slick-link-ext:hover + .row .bttn {background:#000;color:#fff;}
.listelement-rotating-element.white .slick-link-ext:hover + .row .bttn {background:#fff;color:#000;}

.listelement-rotating-element.xltitle h1 {font-size:2em;}

@media (min-width: 767px) {
    .listelement-rotating-element.xltitle h1 {font-size:3em;}
    }

@media (min-width: 991px) {
    .listelement-rotating-element.xltitle h1 {font-size:3.5em;}
    }

@media (min-width: 1200px) {
    .listelement-rotating-element.xltitle h1 {font-size:4.5em;}
    }


/*
=======================================================================
	98. Flexslider
=======================================================================
*/

    .flexslider {
        width: 100%;
        height: 350px;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        /*background: #f1f1f1;*/
        border: none;
        border-radius: 0;
        margin: 0px;
    }

    .flex-control-nav {
        bottom: -30px;
        padding-top: 29px;
    }

    .flexslider li {
        color: #828282;
        line-height: 16px;
    }

    .flex-control-paging li a {
        background: #cdcdcd;
        width: 6px;
        height: 6px;
        box-shadow: none;
    }

    .flexslider .flexcontainer {
        margin-top: 40px;
        padding: 0 30px;
        margin-left: auto;
        margin-right: auto;
    }

    .flexslider .slides img {
        width: auto;
        margin-top: -40px;
    }

    .flex-control-paging li a:active, .flex-control-paging li a:hover, .flex-control-paging li a.flex-active {
        background: #505050;
    }

    .flex-direction-nav .flex-next {
        right: 0px;
    }

    .flex-direction-nav a {
        background: url(../images/flexslider/bg_direction_nav_2.png) 0px 0px no-repeat transparent;
        height: 68px;
        top: 46%;
        width: 44px;
        -webkit-transition: opacity ease;
    }

    .flexslider:hover .flex-prev {
        left: 0px;
    }

    .flexslider:hover .flex-next {
        right: 0px;
    }

    /* SLIDES */

    .flexslider .bg {
        height: 350px;
    }

    .slides {
        height: 350px;
        overflow: hidden;
    }

    .txtbg h1, .txtbg h2, .txtbg h3, .txtbg h4, .txtbg h5, .txtbg h6 {
        color: #fff !important;
        background: #ff530d;
        display: inline;
    }

    .flexslider h1, .flexslider h2, .flexslider h3, .flexslider h4, .flexslider h5, .flexslider h6 {
        margin-top: 0px;
    }

    .txtbg p {
        color: #fff;
        background: rgba(108,108,108,0.8);
        display: inline;
    }

    .txtbg a {
        color: #fff;
    }

    .txtbg a:hover {
        color: #ff530d;
    }

    .sliderPic {
        margin-bottom: 60px;
    }




    /*
=======================================================================
	99. Magnific gallery
=======================================================================
*/

section.gallery .list {padding-right:0;padding-left:0;}

    section.gallery figure {
    margin-bottom: 30px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
    padding-left: 15px;
    padding-right: 15px;
    }

section.gallery figure:hover {
	transform: scale(1.03);
	}

.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
  opacity: 0;
  -webkit-backface-visibility: hidden;
  /* ideally, transition speed should match zoom duration */
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
	}

.mfp-with-zoom.mfp-ready .mfp-container {
    opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
	opacity: 0.4;
	}

.mfp-with-zoom.mfp-removing .mfp-container,
.mfp-with-zoom.mfp-removing.mfp-bg {
  opacity: 0;
	}

@media (min-width:991px) {
        section.gallery .list {
            padding-right: 15px;
            padding-left: 15px;
        }
    }