/*
Theme Name: IAM
Theme URI: https://interaktivmedia.se
Author: Anders Jonasson
Author URI: https://interaktivmedia.se
Description: Ett tema från InteraktivMedia - Den Småländska Webbyrån AB
Text Domain: iam
Version: 1.0
*/


body, main{
	overflow-x: hidden;
	-webkit-appearance: none;
	max-width:100%;
	margin:0 !important;
	padding:0 !important;
}


@media only screen and (max-width: 781px){
	
	h1{
		font-size:1.953rem !important;
		line-height:1.4 !important;
	}
	h2{
		font-size:1.75rem !important;
		line-height:1.4 !important;
	}
	h3,h4,h4,h6{
		font-size:1.5rem !important;
		line-height:1.4 !important;
	}
	p.has-large-font-size{
		font-size: 1.125rem !important;
	}
	
	.wp-block-cover{
		min-height:auto !important;
	}
	.wp-block-cover h1{
		margin-top:60px !important;
	}
	
}


/* Tar bort margin mellan block */
.wp-block-template-part, .wp-block-cover{
	margin-top:0 !important;
}

.wp-block-columns{
	margin-bottom:25px;
}


/* Dessa värden ska vara samma som i theme.json (måste vara med) */
.entry-content > * {
    max-width: 650px;
	margin: auto;
}
.entry-content > .alignwide {
    max-width: 1250px;
}
.entry-content > .alignfull {
    max-width: none;
}
.entry-content > .alignleft {
    float: left;
    margin-right: 2em;
}
.entry-content > .alignright {
    float: right;
    margin-right: 2em;
}



/* Distanselement i mobilt läge */
@media only screen and (max-width: 781px){
	.wp-block-spacer:not(.wp-block-spacer.keep-space){
		max-height:20px;
	}
}

/* Raderar radbrytningar vid liten skärm */
@media only screen and (max-width: 781px){
	main br{content:' ';}
	main br:after{content:' ';}
}

.no-bottom-margin{
	padding-bottom:0;
}

/* Toppmeny*/
#topmenuContent{
	text-align:center;
}
/*
#topmenuContent ul li.current_page_item,
#topmenuContent ul li.current_page_parent{
	background-color: rgba(0, 171, 214, 0.6);
}
*/

/*
#topmenuContent ul li.current_page_item > a{
	color:#000 !important;
	background-color: rgba(255, 255, 255, 0.1) !important;
}
*/

/* Logotyp */
#logotyp{
	position:absolute;
	z-index:1000;
	padding:10px;
	margin-bottom:0px;
}
@media only screen and (max-width: 1400px){
	#topmenuContent{
		text-align:right;
	}
}
@media only screen and (max-width: 1150px){
	#logotyp{
		padding-top:20px;
	}
	#logotyp img{
		height:40px;
		width:auto;
	}
}
@media only screen and (max-width: 1024px){
	#logotyp{
		padding-top:10px;
		padding-left:5px;
	}
	#logotyp img{
		height:30px;
		width:auto;
	}
}


/* Tar bort parallax för mobil */
@media only screen and (max-width: 781px){
	.has-parallax{
		  background-attachment: scroll !important;
	}
}


/* Klickbart block */
.linkarea{
	cursor:pointer;
	transition: all 0.5s;
	border:solid 1px transparent;
}
.linkarea:hover{
	opacity:0.7;
	border:solid 1px transparent;
}
.linkarea h3{
	display:inline-block;
	background-color: rgba(255, 255, 255, 0.6);
	margin:auto;
	padding:0 20px;
}
.linkarea a{
	color:#000;
	text-decoration:none;
}
@media only screen and (max-width: 781px){
	.linkarea{
		min-height:200px !important;
		height:auto;
	}
}


/* Formulär */
#ellibot_hidden_form_1{}
#ellibot_hidden_form_1_container{
	width:450px;
	margin:auto;
	margin-top:0px;
	padding:0px;
	border-radius:10px;
	box-sizing: border-box;
}
#ellibot_hidden_form_1 h3{
	color:#fff;
	text-align:center;
}
#ellibot_hidden_form_1 p{
	color:#fff;
	text-align:center;
	margin-top:0;
}
#ellibot_hidden_form_1 .inputtext, #ellibot_hidden_form_1 .inputbutton{
	-webkit-appearance: none; 
	display:inline;
	background-color: rgba(255, 255, 255, 0.8);
	border:none;
	border-radius:60px 0px 0px 60px;
	font-size:20px;
	padding:15px 20px;
	color:#000;
	margin:auto;
	width:350px;
	box-sizing: border-box;
}
#ellibot_hidden_form_1 .inputbutton{
	border-radius:0px 60px 60px 0px;
	background-color: rgba(0, 119, 149, 1);
	cursor:pointer;
	width:100px;
	color:#fff;
	padding:15px 0px;
}
@media only screen and (max-width: 781px){
	
	#ellibot_hidden_form_1_container{
		width:100%;
		padding:20px 10px 0px 10px;
		/*background-color: rgba(0, 0, 0, 0.5);*/
	}
	
	#ellibot_hidden_form_1 .inputtext, #ellibot_hidden_form_1 .inputbutton{
			width:70%;
			margin-top:20px;
			margin-bottom:0;
	}
	#ellibot_hidden_form_1 .inputbutton{
			width:30%;
	}
	
}


/* Referenser */
#ellibot_ref{width:100%; margin:auto;}
#ellibot_ref .img_container{
	display:none;
	width:33.33%;
	padding-right:25px;
	padding-top:25px;
	float:left;
	box-sizing: border-box;
}
#ellibot_ref .img_container:nth-child(-n+3){
	display:block;
	padding-top:0;
}
#ellibot_ref .img_container:nth-child(3n){
	padding-right:0;
}
#ellibot_ref .img_container.visaalla{
	display:block !important;
}
#ellibot_ref .img_block{
	display:none;
	position:relative;
	width:100%;
	min-height:450px;
	height:auto;
	background-size:cover;
	background-position:center;
	outline: 0px solid #fff;
	transition: all 0.5s;
	cursor:pointer;
	display: flex;
}
#ellibot_ref .img_block:hover{
	opacity:0.8;
}
#ellibot_ref .img_block .img_title{
	background-color: rgba(255, 255, 255, 0.6);
	color:#000;
	text-align:center;
	margin:auto;
	padding:0 20px;
	box-sizing: border-box;
	transition: all 0.5s;
}
#ellibot_ref .img_block .img_title h3{
	display:inline-block;
	margin:0;
	padding:0;
}
#ellibot_ref .img_block .img_title p{
	display:none;
	transition: all 1s;
}
#ellibot_ref .img_block.openBlock:hover{
	opacity:1;
}
#ellibot_ref .img_block.openBlock .img_title{
	background-color: rgba(255, 255, 255, 0.8);
	padding-top:30px;
	min-height:450px;
	height:auto;
	cursor:default;
}
#ellibot_ref .img_block.openBlock .img_title p{
	display:block;
}

/* knapp visa alla referenser */
#visaalla{
	cursor:pointer;
	z-index:1000;
	position:absolute;
	left:-13px;
	margin-top:-100px;
	width:100%;
}
#visaalla .cls-icon-type-btn{
	transition: all 0.5s ease-in-out;
}
#visaalla .cls-icon-type-btn:hover{
	text-decoration:none !important;
	color:#333 !important;
	background-color:#fff !important;
}
#visaalla .cls-icon-type-btn:hover em{
	color:#333 !important;
	transition: all 0.5s ease-in-out;
}

@media only screen and (max-width: 1250px){
	
	#ellibot_ref .img_container{
		width:50%;
	}
	#ellibot_ref .img_container:nth-child(-n+3){
		display:none;
		padding-top:25px;
	}
	#ellibot_ref .img_container:nth-child(3n){
		padding-right:25px;
	}
	#ellibot_ref .img_container:nth-child(-n+2){
		display:block;
		padding-top:0;
	}
	#ellibot_ref .img_container:nth-child(2n){
		padding-right:0;
	}
	
}

@media only screen and (max-width: 781px){
	
	#ellibot_ref .img_container{
		display:none;
		width:100%;
		padding-right:0 !important;
		padding-top:25px !important;
	}
	#ellibot_ref .img_container:nth-child(-n+1){
		padding-top:0px !important;
	}
	#ellibot_ref .img_container:nth-child(3n){
		display:block;
	}
	#ellibot_ref .img_block, #ellibot_ref .img_block.openBlock .img_title{
		height:auto;
		min-height:200px;
	}
	
	#visaalla{
		position:relative;
		margin-top:30px;
	}
	
}

/* Template referens */
body.referens-template #topmenu{
	background-color: rgba(0, 0, 0, 0.9) !important;
}
@media only screen and (max-width: 1024px){
	body.referens-template h1{
		margin-top:0;
	}
	body.referens-template .marginalblock{
		padding:0;
	}
}
@media only screen and (max-width: 781px){
	body.referens-template h1{
		margin-top:60px;
	}
}

.clear{
	clear:both;
}

footer a{
	color:#fff;
}
@media only screen and (max-width: 781px){
	footer .wp-block-cover{
		padding:50px 0;
	}
}