/*
	Theme Name: Semax - Blank Tema
	Theme URI: http://www.effectreklam.se
	Description: Blankt (v2) Wordpress-tema av Effect Reklambyrå
	Version: 19640000.1.80
	Author: Erik Wallberg
	Author URI: http://www.effectreklam.se
	Tags: Effect

	License: MIT
	License URI: http://opensource.org/licenses/mit-license.php
*/

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

#responsive-menu-button{border:2px solid white !important;}

#responsive-menu-wrapper{margin-top:40px !important;}

/*
* {background-color:lightyellow;}
* * {background-color:lightcoral;}
* * * {background-color:lightpink;}
* * * *  {background-color:lightseagreen;}
* * * * * {background-color:lightskyblue;}
* * * * * *{background-color:lightcyan;}
* * * * * * * {background-color:lightsalmon;}
* * * * * * * *{background-color:lightgoldenrodyellow;}
*/

.wpgmza-basic-list-item.wpgmza_div_title {
	font-size: 26px;
	font-weight: 400!important;
	line-height: 28px!important;
}
.wpgmza-basic-list-item .wpgmza_small_img {
	width: 50px!important;
}
.wpgmaps_blist_row {
	display: flex!important;
	justify-content: left!important;
	align-items: center!important;
}

.pageFooter {
	display: flex;
	width: 100%;
	padding-top: 65px;
	padding-bottom: 10px;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	background-color: #000;
	color: #fff;
	font-size: 17px;
	line-height: 22px;
}
.pageFooter a {
	color: #fff;
}
.footerLogo {
	width: 200px;
}
.footerContainer {
	width: 100%;
	max-width: 1280px;
	padding-bottom: 70px;
}
.lowerFooter {
	display: flex;
	width: 100%;
	max-width: 1280px;
	padding-top: 30px;
	padding-bottom: 30px;
	justify-content: center;
	align-items: flex-start;
	border-top: 1px solid #fff;
}
.footerHeading {
	padding-bottom: 6px;
	font-size: 22px;
	line-height: 38px;
	font-weight: 300;
}
.footerText {
	font-size: 17px;
	line-height: 22px;
	font-weight: 300;
}
.footerColumn {
	position: relative;
	float: left;
	width: 100%;
	min-height: 1px;
	padding-left: 10px;
	padding-right: 10px;
	width: 25%;
}
.pageFooter .topPadding {
	padding-top: 25px;
	clear:both;
}

.footerText ul{
	list-style:none;
	padding:0px;
	margin:0px;
	
}

/* 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:400 14px/1.4 'Rubik', Helvetica, Arial, sans-serif;
	color:#444;
	margin:0;
	padding: 0;
}
/* 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 {
	width:100%;
	border: 21px solid #fff;
	margin:0 auto;
	position:relative;
}
/* header */
header {
	display:flex;
	background-color:black;
	height: 110px;
}

#branding{
	max-width:280px; 
	background-color:#004183;
	width:100%;
	padding: 15px 25px;
	display: flex;
	align-items: center;
}
#branding #site-title{max-width:220px; margin:auto;}

/* nav */
nav {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
/* sidebar */
.sidebar {

}
/* footer */
.footer {

}

/*------------------------------------*\
    VIDEO
\*------------------------------------*/

.bg-video {
    width: 100%;
    height: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	position: relative;
	overflow: hidden;
	color:white;
	z-index:0;
}
.vimeo-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 90vh;
    z-index: -1;
    pointer-events: none;
    overflow: hidden;
}
.vimeo-wrapper iframe {
    width: 100vw;
    height: 100vw;
    min-height: 100vh;
    min-width: 177.77vh;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.flipMail{position:absolute; left:-50px; bottom:110px; z-index:3; color:white; font-size:20px;
  transform: rotate(-90deg);}
.flipMail a{color:white;}
.flipmail a:hover {opacity:0.8;}
.flipMail i{margin-right:10px; margin-top:2px;}



/*------------------------------------*\
    GENERAL
\*------------------------------------*/

/* Sidhuvud */
.home .subPageTitle{display:none;}
.subPageTitle{
	display:flex;
	align-items:center;
	justify-content:center;
	background-color:#004183;
}
.subPageTitle h1 {
	color:white;
	font-size:48px;
	font-weight: 300;
	text-transform:uppercase;
}
.subPageTitleIngress h1 {
	text-align: center;
	padding: 0;
	margin-bottom: 0;
}
.subPageTitleIngress p {
	text-align: center;
	padding: 0 10%;
	font-size: 20px;
	font-weight: 300;
	color: white;
}

h1{}

.center{max-width:1280px; margin:auto;}

.readMore{
	background-color:#004183;
	border-radius:30px;
	color:white;
	padding:10px 35px;
	font-size: 22px;
	font-weight: 700;
	text-transform: uppercase;
}
.readMore:hover{
	background-color:grey;
	color:#fff;
}

/* SIDHUVUD */

.pageHeader{
	height:80vh;
	width:100%;
	background-size:cover;
	background-repeat:no-repeat;
	display:flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
	position:relative;
}
.sideImage{
	background-color:rgba(255,255,255,.8);
	max-width:550px;
	width:100%;
	height: auto;
	padding: 30px 100px 30px 50px;
	position:absolute;
	z-index:4;
}
.pageHeader a.puff {
	background: #ea6046;
	border-radius: 50%;
	position: absolute;
	left: 120px;
	bottom: 80px;
	z-index: 4;
}
.pageHeader a.puff:hover {
	background: #004a95;
}


/*------------------------------------*\
	ARKIV
\*------------------------------------*/

.section0{background-color:#eeeeee; padding-top:30px; padding-bottom:30px;}
.section0 h3{padding:0px; font-size:40px; text-align:center; color:#666; margin:0px; padding-bottom:10px;}
.newsList{list-style:none; display:flex; justify-content:center;}
.newsList li{max-width:450px; min-height:30px; padding:10px 20px; border:2px solid #ccc; font-size:20px; width:100%; background-color:white; margin:10px;
border-radius:20px;}
.newsList li:hover{background-color:#708090;}
.newsList li:hover > a, .newsList li:hover > span, .newsList li:hover > time{color:white !important;}
.newsList li a{width:100%; display:flex; align-items:center;}
.newsList li span{width:100%; padding-left:25px;}
.newsList li time{font-size:30px; padding-right:25px; border-right:4px solid #444444;} 
.newsList li:hover > a time{border-right:4px solid #fff;} 

/********/

.accordion-toggle {position:relative; padding-bottom:5px; cursor: pointer; font-size:30px; line-height:30px; }
.accordion-content {display: none;}
.accordion-content.default {display: block; /*padding-top:60px;*/ padding-bottom:30px;}

.accordion-toggle2 {position:relative; padding-bottom:0px; cursor: pointer; line-height:30px; }
.arkivAccordion h2{font-size:38px; margin:0px; border-bottom:12px solid slategray; padding-bottom:2vw; padding-top:2vw; margin-top:5px; -webkit-transition: all 1s; /* Safari */ transition: all 1s; max-width:500px; margin:auto;}
.arkivAccordion h2:hover{border-color:#fd262e; color:#aaa;}
.arkivAccordion{text-align:center;}
.arkivAccordion{list-style:none; padding:0px;}
.arkivAccordion li{list-style:none;}
.arkivAccordionContent div{box-shadow: inset 0 3px 4px #eee; padding:10px;}
.arkivAccordionContent div:hover{background-color:#efefef;}
.arkivAccordionContent p{margin-bottom:0px; margin-top:0px;}
.arkivTime{color:#444444;}

.readAccordioin{/*text-shadow:1px 1px #333;*/ display:block;justify-content:center;align-items:flex-end;width:100%;height:100%; text-align:center;color:white; margin-top:-100px;}
.readAccordioin span{display:block; font-size:50px; -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg);}
.accordion-toggle:hover> .readAccordioin{color:#ccc; }

/*****************************************/


/*------------------------------------*\
    MODULES
\*------------------------------------*/

/* Rubrik & Ingress */
.rubrikIngress{ 
	color: black;
	width: 100%;
	padding: 50px 0;
}
.rubrikIngress h1 {
	font-size: 62px;
	font-weight: 300;
	margin-bottom: 0;
	padding: 0;
	text-align: center;
}
.rubrikIngress p {
	font-size: 32px;
	font-weight: 400;
	font-style: italic;
	text-align: center;
}

.rubrikIngress2{ 
	color: black;
	width: 70%;
	padding: 50px 150px;
}
.rubrikIngress2 h1 {
	font-size: 62px;
	font-weight: 300;
	margin-bottom: 0;
	padding: 0;
	text-align: left;
}
.rubrikIngress2 p {
	font-size: 20px;
	font-weight: 300;
	text-align: left;
}
.rubrikIngress2 .wp-caption-text {
	font-size: 16px;
	font-style: italic;
}
/* Karusell */
.owl-carousel{
	padding: 0 0 90px 0;
}
.owlSlide{
	width: 100%;
    display: flex;
    align-items: center;
    background: #e8e8e8;
}
.owlImage {
	width: 50%;
	padding: 0 50px;
	border-right: 1px solid #f4f4f4;
}
.owlContent{
	width: 50%;
	padding: 0;
    text-align: center;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}
.owlPositioner{
	width: 80%;
}
.owlPositioner .refName {
	width: 100%;
	display: block;
	font-size: 28px;
	font-weight: 700;
	color: #000;
	text-transform:uppercase;
}
.owlPositioner .refCompany {
	width: 100%;
	display: block;
	font-size: 18px;
	font-weight: 500;
	color: #666;
	text-transform:uppercase;
	letter-spacing: 2px;
}
.owlContent span {
	
}
.owlContent p {
	font-size: 17px;
	font-weight: 400;
}

/* Kvadrater */
.squareContainer{
	display:flex;
	color: #fff;
}
.squareContainer span{
	font-size: 60px;
	font-weight: 300;
	text-transform: uppercase;
	margin: 0;
}
.squareContainer p{
	font-size: 36px;
	font-weight: 400;
	margin: 0 0 30px 0;
}
.squareSeparator {
	background:white;
	height: 3px;
	width:65px;
	margin: 20px 0;
}
.squareContainer .readMore {
	background-color:white;
	color:#004183;
	/*
	font-size: 22px;
	font-weight: 700;
	text-transform: uppercase;
	*/
}
.squareContainer .readMore:hover {
	background-color:#004183;
	color:#fff;
}

.squareLeft, .squareRight{
	max-width:50%;
	width:100%;
	height: 680px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.squareLeft{
	background-size: cover;
	background-repeat: none;
}
.squareRight {
	background-size: cover;
	background-repeat: none;
}


/* Tabbmeny */
.tabMenu{
	background-color:#ececec;
	min-height:80px;
}
.tabMenu .center{
	display:flex;
	justify-content:space-between;
	min-height:130px;
}
.tabMenu a{
	background-color:#d7d7d7;
	color:white; width:95%;
	margin:0px 0px; padding:5px;
	display:flex; align-items:center;
	justify-content:center;
	text-transform:uppercase;
	font-size: 40px;
	font-weight: 300;
}
.tabMenu a:hover{
	background-color:#bbb;
}
.is_active{
	background-color:#fff !important;
	color:#d7d7d7 !important;
}

/* 50-50 */

.graBG{background-color:#eee;}
.twoColourBG{position:relative; padding:150px 0px;}
.colouredDiv{background-color:#e8e8e8; width:50%; height:100%; position:absolute; right:0px; top:0px; z-index:-1;}
.colouredDivLeft{background-color:#fbfbfb; width:50%; height:100%; position:absolute; left:0px; top:0px; z-index:-1;}

.twoColumn{
	display:flex;
	font-weight: 300;
	font-size: 18px;
	line-height: 26px;
}
.truckShow .twoColumn{justify-content:center; margin-top:60px;}
.truckShow .columnOne{width:50%; padding:10px;}
.truckShow .columnOneImage{width:50%; text-align:center;}


.twoColourBG .columnOne{width:40%; padding:10px;}
.twoColourBG .columnOneImage{width:60%;}

/* Visningssida truckar enbart */
.single-truckar .twoColourBG{padding:75px 0px;}
.single-truckar .colouredDiv{background-color:white !important;}
.single-truckar .colouredDivLeft{background-color:white !important;}
.single-truckar .twoColourBG .columnOne{width:50%; padding:10px;}
.single-truckar .twoColourBG .columnOneImage{width:50%;}

.columnOneText{display:flex; align-items:center; }
.columnLeft div{padding-left:20px; padding-right:10px;}
.columnOneText div{padding-right:20px;}
.twoColumn h1.entry-title {
	font-weight: 300;
	font-size: 42px;
	line-height: 46px;
}

/* Nedladdningsformulär */

.downloadForm{max-width:800px; margin:50px auto;}
.downloadForm span{font-weight:700; font-size:16px;}
.downloadForm{}


/*------------------------------------*\
   GALLERY
\*------------------------------------*/

.galleryContent{display:flex; justify-content:center; max-width:1400px; margin:auto; flex-wrap:wrap;}
.galleryImage{flex-basis:32.33%;}

.galleryImage {
  width: 32.33%;
  padding-bottom: 32.33%;
  margin:0.4vw auto;
  position: relative;
  overflow: hidden;
}

.galleryImage img {
  position: absolute;
  height: 100%;
  max-width:200%;
}

/* TVÅ KOLUMNER */

.twoColumnKontakt {
	display:flex;
}
.twoColumnKontakt h3 {
	font-size: 22px;
	line-height: 24px;
	padding: 0;
	font-weight: 500;
}
.twoColumnKontakt div{
	width:100%;
}

.wpcf7{}
.wpcf7 input, .wpcf7 textarea{width:100%;}
.wpcf7 input, .wpcf7 textarea {
	font-size: 17px;
	line-height: 24px;
	padding: 5px;
}
.wpcf7-submit{
	background-color: #004183;
	color: #fff;
	font-size: 18px;
	border: none;
	padding:10px;
	max-width:200px;
}
.wpcf7-submit:hover {
	background-color: #000;
}

/*------------------------------------*\
    MAX MEGA MENU - 
\*------------------------------------*/

/* STYRS UNDER PLUGINET MEGA MENU - CUSTOM THEME - P.G.A ANNARS MÅSTE ALLT VARA !important; */

/*------------------------------------*\
    TRUCKAR
\*------------------------------------*/

.truckContainer{
	display:flex;
	flex-wrap:wrap;
	margin-bottom: 90px;
}
.truckContent{
	max-width:25%;
	height: 570px;
	width:100%;
	margin-top:40px;
	display:table;
}
.truckContent h2 {
	font-size: 24px;
	font-weight: 400;
}
.truckStats .truckRow {
	padding: 0 0 10px 0;
}
.truckStats{
	font-weight:300;
	font-size: 16px;
	line-height: 20px;
	margin: 0 0 25px 0;
}
.truckStats .icon {
	margin-right: 5px;
	padding: 0px 0;
	height: 20px;
}
.truckContent a {
	font-weight: 700;
	font-size: 18px;
	color: #fff;
	padding: 7px 30px;
	background: #004a95;
	border-radius: 24px;
	text-transform: uppercase;
}
.truckContent a:hover {
	color: #fff;
	background: #454545;
}
.truckImage{}

/*------------------------------------*\
    KONTAKT
\*------------------------------------*/

.fourColumn {
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	padding: 20px 0;
	font-size: 18px;
	font-weight: 300;
}
.fourColumn h3 {
	font-size: 22px;
	line-height: 24px;
	padding: 0;
	font-weight: 500;
}
.fourColumn div {
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}


/*------------------------------------*\
    OWL
\*------------------------------------*/

.owl-prev, .owl-next {
	height: 100px;
	position: absolute;
	top: 35%;
	transform: translateY(-50%);
	display: block !important;
	border:0px solid black;
}
.owl-prev { left: -55px; }
.owl-next { right: -55px; }
.owl-prev i, .owl-next i {
	transform : scale(2,5);
	color: #ccc;
}
.owl-next:hover, .owl-prev:hover{
	background-color:#004a95!important;
}
/*------------------------------------*\
	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 (max-width:1380px) {
	.truckContent{
		max-width:33.333%;
	}
}
@media only screen and (max-width:1280px) {

	.owl-carousel{max-width:92%;}
    .owl-prev { left: -50px; }
    .owl-next { right: -50px; }
	
	#mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link{padding:0px 9px 0px 9px !important;}
	
}
@media only screen and (max-width:1140px) {


}
@media only screen and (max-width:1024px) {
	.truckContent{
		max-width:50%;
	}
	.pageHeader a.puff {
		display: none;
	}
}
@media only screen and (max-width:768px) {
	.twoColumn{display:block;}
	.single-truckar .columnOne, .single-truckar .columnOneImage, .truckShow .columnOneImage, .truckShow .columnOne, .twoColourBG .columnOne, .twoColourBG .columnOneImage{width:100% !important;}
}
@media only screen and (max-width:480px) {
	.truckContent{
		max-width:100%;
	}
	.flipMail{ transform: rotate(0deg); bottom:20px; left:20px;}
}
@media only screen and (max-width:320px) {
	
}

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

}