/*
	Theme Name: Aprobo
	Theme URI: http://dobus.se
	Description: Aprobo tema som är skräddarsytt för företaget.
	Version: 1
	Author: Dobus AB
	Text Domain: html5blank
*/

/*------------------------------------*\
    MAIN
\*------------------------------------*/

/* global box-sizing */
*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
/* html element 62.5% font-size for REM use */
html {
	font-size:62.5%;
}
body {
	font:300 11px/1.4 'Helvetica Neue', Helvetica, Arial, sans-serif;
	color:#444;
}
/* clear */
.clear:before,
.clear:after {
    content:' ';
    display:table;
}

.clear:after {
    clear:both;
}
.clear {
    *zoom:1;
}
img {
	max-width:100%;
	vertical-align:bottom;
}
a {
	color:#444;
	text-decoration:none;
}
a:hover {
	color:#444;
}
a:focus {
	outline:0;
}
a:hover,
a:active {
	outline:0;
}
input:focus {
	outline:0;
	border:1px solid #04A4CC;
}

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/

/* wrapper */
.wrapper {
	max-width:1280px;
	width:95%;
	margin:0 auto;
	position:relative;
}
/* header */
.header {
}
/* logo */
.logo {

}
.logo-img {

}
/* nav */
.nav {

}
/* sidebar */
.sidebar {

}
/* footer */
.footer {

}

/*------------------------------------*\
    PAGES
\*------------------------------------*/



/*------------------------------------*\
    IMAGES
\*------------------------------------*/



/*------------------------------------*\
	TYPOGRAPHY
\*------------------------------------*/

@font-face {
	font-family:'Font-Name';
	src:url('fonts/font-name.eot');
	src:url('fonts/font-name.eot?#iefix') format('embedded-opentype'),
		url('fonts/font-name.woff') format('woff'),
		url('fonts/font-name.ttf') format('truetype'),
		url('fonts/font-name.svg#font-name') format('svg');
    font-weight:normal;
    font-style:normal;
}

/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/

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

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

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

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

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

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

}
@media only screen and (-webkit-min-device-pixel-ratio:1.5),
	   only screen and (min-resolution:144dpi) {

}

/*------------------------------------*\
    MISC
\*------------------------------------*/

::selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-webkit-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-moz-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}

/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/

.alignnone {
	margin:5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
	display:block;
	margin:5px auto 5px auto;
}
.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
a img.alignnone {
	margin:5px 20px 20px 0;
}
a img.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.aligncenter {
	display:block;
	margin-left:auto;
	margin-right:auto;
}
.wp-caption {
	background:#FFF;
	border:1px solid #F0F0F0;
	max-width:96%;
	padding:5px 3px 10px;
	text-align:center;
}
.wp-caption.alignnone {
	margin:5px 20px 20px 0;
}
.wp-caption.alignleft {
	margin:5px 20px 20px 0;
}
.wp-caption.alignright {
	margin:5px 0 20px 20px;
}
.wp-caption img {
	border:0 none;
	height:auto;
	margin:0;
	max-width:98.5%;
	padding:0;
	width:auto;
}
.wp-caption .wp-caption-text,
.gallery-caption {
	font-size:11px;
	line-height:17px;
	margin:0;
	padding:0 4px 5px;
}
.sticky {

}
.bypostauthor {

}

.product-family-button.eng-btn {
    display: none;
}
[lang="en-US"] .product-family-button {
    display: none;
}
[lang="en-US"] .product-family-button.eng-btn {
    display: block;
}

/*------------------------------------*\
    PRINT
\*------------------------------------*/

@media print {
	* {
		background:transparent !important;
		color:#000 !important;
		box-shadow:none !important;
		text-shadow:none !important;
	}
	a,
	a:visited {
		text-decoration:underline;
	}
	a[href]:after {
		content:" (" attr(href) ")";
	}
	abbr[title]:after {
		content:" (" attr(title) ")";
	}
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content:"";
	}
	pre,blockquote {
		border:1px solid #999;
		page-break-inside:avoid;
	}
	thead {
		display:table-header-group;
	}
	tr,img {
		page-break-inside:avoid;
	}
	img {
		max-width:100% !important;
	}
	@page {
		margin:0.5cm;
	}
	p,
	h2,
	h3 {
		orphans:3;
		widows:3;
	}
	h2,
	h3 {
		page-break-after:avoid;
	}
}

/* tillägg inka */

.wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal {
    position: absolute;
    right: 40px;
}

.wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal a {
	color:#fff;
}

header {
	transition:0.5s all ease;
	background:#111 !important;
}

#searchform	{
	display: none;
}

.nav-right {
    margin-right: 0 !important;
    margin-top: 50px !important;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nav-right a {
    padding-left: 25px !important;
    padding-right: 25px !important;
    font-size: 18px !important;
}

body {
	background:#dedede;
}

main {
    margin:0 auto;
    /*max-width: 1400px;*/
    background:#fff !important;
}


header, footer {
	/*max-width: 1400px;*/
	margin:0 auto !important;
}

header, .header-comp {
	height:105px;
}

.landing .flickity-viewport {
	height:600px !important;
}

.landing .background-image, .hero-body {
    height: 100% !important;
}

.landing .hero-body, .landing .hero-body .container {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align:center;
    margin:0 auto;
}

.column.is-8 {
    width: 66.67%;
    margin: 0 auto;
}

.landing h1:after {
    margin:0 auto;
}

.landing-puffar {
	display:flex;
	padding-top:8px;
	padding-bottom:8px;
	background:#fff;
}

.landing-puffar .puff {
	flex:1;
	margin-left:8px;
	height:400px;
}

.landing-puffar .puff {
	flex:1;
	margin-left:8px;
	height:33.3333vw;
	position:relative;
	overflow: hidden;
}

.landing-puffar .puff:first-child {
	margin-left:0;
}


.landing-puffar .puff .pufftext {
	height: 100%;
	width:100%;
	display: flex;
	flex-direction:column;
	position: relative;
	z-index:1;
	align-items: center;
	justify-content: center;
	color:#fff;
	padding:30px;
	text-align: center;
	font-weight:400;
	transition:0.3s all ease;
}

.landing-puffar .puff .pufftext p {
	margin-top:10px;
	font-size: 1.3vw;
}


.landing-puffar .puff .pufftext h2 {
	font-family: Teko;
	font-weight: 700;
	font-size:3.2vw;
	transition:0.3s all ease;
	text-transform:uppercase;
}

.landing-puffar .puff img {
	position:absolute;
	top:0;
	left:0;
	width: 100%;
	height:100%;
	object-fit:cover;
}

.linkblock {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	text-indent:-99999px;
	z-index:2;
}

#logo {
	left: 50px;
	bottom:20px;
	width:170px;
	position: absolute;
}

.om-section {
	background:#fff;
}

.om-section .inner-content {
	margin:0 auto;
	padding:80px 0 90px 0;
	width: 90%;
	max-width:800px;
	display: flex;
}

.om-section .inner-content .bild {
	width:300px;
	height:300px;
}

.om-section .inner-content .text {
	padding-left:60px;
	flex:1;
	color:#111 !important;
}

.om-section .inner-content .text h2 {
	font-family: Teko;
	font-weight: 700;
	font-size:44px;
	margin-bottom:10px !important;
}


.om-section .inner-content .text p {
	color:#111 !important;
	margin-top:0;
}

.landing-puffar .overlay {
	background: radial-gradient(circle, rgba(0,0,0,0.6) 0%, transparent 75%);
	position:absolute;
	top:0;
	left:0;
	width: 100%;
	height:100%;
	z-index:-1;
	/* opacity:0; */
	transition:0.3s all ease;
}

.new-button {
	background: #FB926E !important;
    text-transform:uppercase;
    color: #fff !important;
    border: none;
    letter-spacing: 0px !important;
    padding: 12px 25px 11px;
    border-radius: 0;
    line-height: 1;
    margin-top: 10px;
    display: inline-block !important;
}

.hover-content {
	opacity: 0;
	height:0;
	transform:translate(0,50px);
}

.landing-puffar .puff:hover .hover-content {
	opacity:1;
	height:auto;
	transition:0.3s all ease;
	transform:translate(0, 0);
}

.landing-puffar .puff:hover .overlay {
	background:rgba(0,0,0,0.7);
	/* opacity:1; */
}

.product-family {
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 0 !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.product-collection-next-product-collection {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-bottom:0 !important;
    min-height:35vw !important;
}

.product-collection-next-product-collection-subtitle {
    padding-top: 0 !important;
}

.landing h1 {
	margin:15px 0;
    line-height: 0.8;
}

.landing h1:after {
    margin-top:15px;
}

meny {
    width: 45px;
    display: block;
    bottom: 0;
    right: 30px;
    margin-top: 25px;
    margin-right: 10px;
}

.nav-menu-btn-close, .nav-menu-btn-close img {
	width:30px;
	display: block;
	height: 30px;
}

span.nav-menu-btn-close.menu-btn.nav-mobile-btn-close.is-uppercase {
    position: absolute;
    top: 30px;
    right: 35px;
}


.nav-mobile {
	background:#f87d5b !important;
    padding: 50px;
    text-align: center;
    font-size: 28px;
    z-index: 20 !important;
}

.nav-mobile a {
	color:#fff;
}

.wpml-ls-legacy-list-horizontal {
	z-index:10;
}

.product-collection-next-product-collection {
    padding-top: 25px !important;
    padding-bottom: 30px !important;
}

form.search {
    position: absolute;
    right: 180px;
    display: none !important;
    top:3px;
}

.nav-right .search-input {
	border:none !important;
	height:15px !important;
	margin-top:7px !important;
	padding:12px 0 !important;
	letter-spacing:0 !important;
	width:230px !important;
	text-align:right;
}

form.search button {
	background: none;
	color:#fff;
	height:auto;
	padding:0;
	margin:0;
	border:none;
	position:relative;
}

form.search button:before {
	content:url(img/searchicon.svg);
	position: absolute;
	top:12px;
	left:0;
	width:16px;
}

.flickity-slider-landing h3 {
	text-transform:uppercase;
}

.media.center {
  display: flex;
  align-items: flex-start !important;
  justify-content: flex-start !important;
}

.media-left {
	display: flex;
	height:100%;
}

.carousel-cell .media-left {
	flex-shrink: unset !important;
}

.products a {
	font-size:26px !important;
	line-height:1 !important;
}

.media-left img {
	height: auto !important;
}

body .menu-btn {
    top: 7px;
}

body .product_header .media h3 {
    margin-bottom: -10px !important;
}

.wpml-ls-legacy-dropdown {
   width: auto !important;
    max-width: 100%;
    position: absolute;
    right: 0;
    color:#fff;
}

.wpml-ls-legacy-dropdown {
    top: 5px;
    right: 15px;
}

.wpml-ls-legacy-dropdown a {
    border:none;
    background-color: transparent;
}

.wpml-ls-native {
	color:#ededed;
}

.wpml-ls-legacy-dropdown a:hover, .wpml-ls-legacy-dropdown a:focus, .wpml-ls-legacy-dropdown .wpml-ls-current-language:hover>a {
    background: transparent;
}


@media (min-width: 72em) and (max-width: 99.9em) and (orientation: landscape) {
.static-image {
    top: 140px !important;
}
}

/* Responsive Width Section (Mobile Phone)
================================================== */

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

			.nav-right {
				display: none;
			}
			
			body .menu-btn {
				display:block !important;
			}
			
			.wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal {
			    right: 24px;
			}
			
			.wpml-ls-legacy-dropdown {
			    right: 105px;
			}


	}

/* ================================================ */

/* Responsive Width Section (Mobile Phone)
================================================== */

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

		.landing-puffar {
		    flex-direction:column;
		}


		.landing-puffar .puff {
		    height: auto !important;
		    margin-bottom:8px;
		    margin-left:0px;
		}
		
		.landing-puffar .puff .pufftext p {
		    font-size: 18px;
		}
		
		.landing-puffar .puff .pufftext h2 {
		    font-size: 28px;
		}
		
		.hover-content {
			display: block !important;
			opacity:1 !important;
			height:auto;
			transform:translate(0,0);
		}
		
		.landing-puffar .overlay {
		    opacity: 1;
		}
		

		.om-section .inner-content {
		    flex-direction:column;
		    padding-top:5vw;
		}
		
		.om-section .inner-content .bild {
		    width: 100%;
		    height: auto
		}
		
		.om-section .inner-content .bild img {
		    width: 100%;
		    height: auto
		}
		
		.om-section .inner-content .text {
		    padding-left: 0;
		    margin-top:30px;
		    font-size:21px;
		}


	}

/* ================================================ */


/* Responsive Width Section (Mobile Phone)
================================================== */

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

		header, .header-comp {
			height:60px !important;
		}
		
		#logo {
		    left: 15px;
		    bottom: 15px;
		    width: 110px;
		}
		
		
		meny {
		    margin-top: -22px;
		    margin-right: -13px;
		}
		
		.wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal {
		    right: 80px;
		    top: 5px;
		}
		
		.hero-body {
		    padding: 0 !important;
		}
		
		.product-collection-next-product-collection {
		    height:auto;
		    min-height:none !important;
		}
		
		body .menu-btn {
		    top: 15px;
		}
		
		.wpml-ls-legacy-dropdown {
			right: 75px;
			top:0px;
		}




	}

/* ================================================ */


/* MOVED FROM THEME CUSTOMIZER */

/* .nav-right {
	width: 100%;
	margin-right: 55px;
	margin-top: 45px;
}
.nav-right ul {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}
.nav-right a {
	font-size: 20px;
	color: #fff;
	font-weight: 600;
}
.nav-right .search-input {
	padding: 20px;
	height: 48px;
}
.nav-right .search-button {
	height: 48px;
	width: 60px;
	cursor: pointer;
}
.menu-item-has-children {
	position: relative !important;
	display: inline-block !important;
} */

/* .sub-menu {
	display: none !important;
	position: absolute !important;
	background-color: rgb(34, 34, 34) !important;
	min-width: 160px !important;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2) !important;
	padding: 12px 16px !important;
	z-index: 1 !important;
} */

/* .menu-item-has-children:hover .sub-menu {
	display: block !important;
	animation: growDown 300ms;
	transform-origin: top center;
	white-space: nowrap;
} */

/* li > a:hover {
	background-position: left;
} */

/* @keyframes growDown {
	0% {
		transform: scaleY(0);
	}
	80% {
		transform: scaleY(1.1);
	}
	100% {
		transform: scaleY(1);
	}
} */
	

/* ================================================ */


/* TEMPL ADDED */
.landing h3.underrubrik {
	font-family: "futura-pt",sans-serif;
	font-style: italic;
    font-weight: 400;
	font-size: 30px;
    margin-top: -10px;
    margin-bottom: 10px;
    color: #FB926E;
}

/* The whole menu */
@media only screen and (min-width: 769px) {
    #mega-menu-wrap-header-menu {
        background: none;
    }
}

/* Link text  */
#mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-item>a.mega-menu-link {
    font-weight: 600 !important;
    font-size: 1.25em;
    height: 55px;
    padding: 0 15px 0 15px;
	background-color: transparent !important;
}

@media only screen and (max-width: 1200px) {
    #mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-item>a.mega-menu-link {
        font-size: 1.1em;
    }
}

/* Active link text */
#mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-item.mega-current-menu-item>a.mega-menu-link,
#mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-item.mega-current-menu-ancestor>a.mega-menu-link,
#mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-item.mega-current-page-ancestor>a.mega-menu-link {
    background: none;
}

/* Hover link text  */
@media only screen and (min-width: 769px) {
    #mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-item>a.mega-menu-link:hover {
        background: none;
    }
}

/* Make sub menus full width */
#mega-menu-wrap-header-menu,
#mega-menu-header-menu {
    position: initial !important;
}

#mega-menu-header-menu {
    white-space: nowrap !important;
}

body>header>.nav-right {
    margin: 0 !important;
    margin-top: 105px !important;
    transform: translateY(-100%);
}

body.mega-menu-header-menu-mobile-open .site-header .logo-container,
body.mega-menu-header-menu-mobile-open .site-header .language-selector-container {
    display: none;
}

body.mega-menu-header-menu-mobile-open #mega-menu-wrap-header-menu {
    position: absolute !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: 100vh;
    background-color: #222;
}

#mega-menu-wrap-header-menu .mega-menu-toggle {
    background-color: transparent !important;
    margin-top: 6px;
}

.site-header {
    width: 100%;
    padding: 0 40px;
}

.site-header-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    height: 105px;
}

@media only screen and (max-width: 580px) {
    .site-header-container {
        height: 60px;
    }

    .site-header .logo-container img {
        width: 100px !important;
    }
}

.site-header .logo-container img {
    width: 170px;
    height: auto;
}

@media only screen and (min-width: 1000px) {
    .site-header {
        width: 100%;
        padding: 0 40px;
    }

    .site-header .logo-container {
        margin-right: 40px;
    }

    .site-header .language-selector-container {}

    .site-header .nav-container {
        flex-grow: 1;
        display: flex;
        justify-content: center;
        margin-top: 50px;
    }
}

@media only screen and (max-width: 999px) {
    .site-header {}

    .site-header-container {}

    .site-header .logo-container {}

    .site-header .logo-container img {}

    .site-header .language-selector-container {}

    .site-header .nav-container {}
}

#mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-megamenu>ul.mega-sub-menu {
    background-color: #fff !important;
    padding-bottom: 20px;
}

.mega-menu .custom-html-widget h1 {
    font-size: 2em;
    font-weight: 600;
    text-transform: uppercase;
    color: #555;
    margin: 20px 0 -10px 0;
}

.mega-menu .menu-item a {
    color: #555;
    margin-left: -3px !important;
}

@media only screen and (max-width: 768px) {
    #mega-menu-wrap-header-menu .mega-menu-toggle.mega-menu-open + #mega-menu-header-menu {
        max-height: 100vh;
        overflow-y: scroll;
    }
}

#mega-menu-wrap-header-menu #mega-menu-header-menu li.mega-menu-column a,
#mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-item>a.mega-menu-link {
	position: relative;
}
#mega-menu-wrap-header-menu #mega-menu-header-menu li.mega-menu-column a::after,
#mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-item>a.mega-menu-link::after {
	content: " ";
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(to left, rgba(76, 175, 80, 0) 50%, #FB926E 50%) right;
	background-size: 205%;
	transition: .2s ease-out;
}
#mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-item>a.mega-menu-link::after {
	bottom: 10px;
}
#mega-menu-wrap-header-menu #mega-menu-header-menu li.mega-menu-column a:hover::after,
#mega-menu-wrap-header-menu #mega-menu-header-menu>li.mega-menu-item>a.mega-menu-link:hover::after {
	background-position: left;
}

@media only screen and (min-width: 1001px) {
	#mega-menu-wrap-header-menu #mega-menu-header-menu li.mega-menu-item.mega-menu-megamenu ul.mega-sub-menu ul.mega-sub-menu {
		display: flex;
		justify-content: space-evenly;
	}
	#mega-menu-wrap-header-menu #mega-menu-header-menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row:not(:first-of-type) > ul.mega-sub-menu > li.mega-menu-columns-3-of-12 {
		width: auto !important;
		max-width: 330px;
	}
}


body.arkiv section.hero,
body.kontakt section.hero {
    display: none;
}

body.kontakt .hero-body > .container {
	display: grid;
}

body.kontakt .hero-body > .container > .container.images {
	order: -1
}

body.kontakt .hero-body > .container > .contact-header-detail,
body.kontakt .hero-body > .container > .wp-block-heading,
body.kontakt .hero-body > .container > .wp-block-heading + .wp-block-group {
	order: -2;
}