/*-----------------------------------------------------------------------------------------
  Sida: The Thing About Us
  COPYRIGHT (c) ASKS INTERNET- & REKLAMBYR AB 1997-2020. ALLA RTTIGHETER RESERVERADE
-----------------------------------------------------------------------------------------*/
@media screen and (max-width: 1200px) {
	td, tr {text-overflow:ellipsis; white-space:normal;}	
	html {-webkit-text-size-adjust: none; /* Prevent font scaling in landscape */}
	img, iframe {max-width:100%; height:auto;}	
	.sokrutan {display:none;}
	#footer-wrapper {padding:0 10px;}
}

/*---------------------------------------------------------------------------------------*/
@media screen and (max-width: 850px) {
	[class*="span_"] {width:100%;}
	.col {margin:0;}
	.home-hero.hero1 {min-height:560px;}
	.textbox {top:60%;}
	
	/*----------------------------------------------
	  Arbetsyta
	----------------------------------------------*/
	#bodywrapper {background-position:left top; background-attachment:inherit;}
	.header-wrapper {background:#222;}
	.nomobile, #nav6Meny, .sokrutan, .meny, .header.scroll .logo {display:none;}
	.topplist {padding:0 10px; position:relative; min-height:60px;}
	.topplist .center {text-align:left;}
	.logo {width:75%; margin:2px 0 0; position:absolute; left:50%; top:50%; -ms-transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
	.logo img {max-height:45px; width:auto;}
	.soktoggle {margin:13px 0 0;}
	.meny {float:left; width:100%;}
	.header {padding:0;}
	.header .section, #footer .section {padding:0 10px;}
	.header h1 {font-size:35px; margin:0;}
	#main {padding-top:30px;}
	.bg2 {background-attachment:inherit;}
	#footer .section .col {text-align:center; margin:0 0 20px 0;}
	#footer {padding:40px 0 21px;}
	#footer p {font-weight:300; line-height:25px;}
	.hero0 {min-height:170px;}
	.hero0 .textbox {padding-top:10px;}
	.desktop {display:none;}
	.mobile {display:block;}
	.about .span_1_of_7 {width:48%;}

	/*----------------------------------------------
	  Meny
	----------------------------------------------*/
	.mobilenav-icon {display:block; cursor:pointer; line-height:51px; font-size:22px; float:left !important; display:none;}
	.mobilenav-icon::after {font-family:"SS BlackTie-Regular"; content:"\E9A1"; color:#f5f5f5; text-shadow:0 1px 2px #000;}
	.stang::after {font-family:"SS BlackTie-Regular";  content:"\2421";}	
	.mobilenav.active .stang::after {display:block;}
	.mobilenav.active .stang {color:#222; z-index:100; position:fixed; left:10px; top:25px; cursor:pointer; font-size:20px;}	
	.mobilenav {display:none;}
	.mobilenav.active {width:100%; height:100%; left:0; top:0; overflow-x:hidden; overflow-y:scroll; position:fixed; display:block !important; z-index:100; padding:10px; background:rgba(255,255,255,1)}
	.mobilenav.active .meny {margin:0 !important; display:block !important; background:none; text-align:left;}
	.mobilenav.active .sokrutan {width:100%; margin:20px 0px; display:block !important;}
	.mobilenav.active .sokruta {width:81.5%; -webkit-appearance:none;}
	.mobilenav.active .sokknapp {width:18%;}
	.mobilenav.active .logomeny {display:block;}
	.mobilenav.active .logo {top:25px; position:relative;}	
	.mobilenav.active #nav6Meny {display:block;}
	#nav6Meny .active {display:block !important;}
	.fa-chevron-down {float:right; color:#fff;}
	i.fa-chevron-down {padding:2px 0 2px 10px;}
	.martin {display:none !important;}
	
	/* NIVÅ 1 */
	.mobilenav.active #nav6Meny ul:first-of-type {display:none;}
	.mobilenav.active #nav6Meny ul li a[href="/sv/index.html"] {display:none !important;}
	.mobilenav.active #nav6Meny ul {width:100%; padding:8px 0; border-bottom:1px solid #eee;}
	.mobilenav.active #nav6Meny ul li {margin:0 5px 0 0; position:relative; border:none;}
	.mobilenav.active #nav6Meny ul li a {color:#222 !important; display:block; margin:0; padding:3px 0; width:100%; line-height:30px;}
	.mobilenav.active #nav6Meny ul li a p {color:#222; font-weight:700; text-shadow:none; margin-bottom:0; font-size:15px;}
	.mobilenav.active #nav6Meny ul li a h3 {font-size:16px !important; margin:0; color:#222;}
	.mobilenav.active #nav6Meny ul li a:hover {background:transparent;}
	.mobilenav.active #nav6Meny ul li a:hover p {color:#222 !important; text-shadow:none;}
	
	/*----------------------------------------------
	  Typografi
	----------------------------------------------*/
	i.fa-chevron-down {font-size:23px;}
	.h1stor {font-size:30px;}
	h1 {font-size:30px;}
	h2 {font-size:35px;}
}
@media screen and (max-width: 610px) {
	.h1stor {font-size:30px;}
	.textbox .Ingress {font-size:14px;}
	.p30 iframe {float: none !important; margin: 0 0 20px;}
	.p30 .span_12_of_12 {margin-bottom: 36px;}
	.p30 h2 {margin-bottom: 30px !important;}
}
@media all and (max-width:450px) and (min-width:200px) {
	#FotoGalleri a {margin:0 0 1% 0; width:100%;}
	input, textarea {max-width:100%;}
	.mer_slider .autowrap {height: auto;}
	.footerpuff h3{font-size: 16px;}
	.hero0 {min-height:170px;}
	.hero0 .Ingress {padding:10px; font-size:15px !important; line-height:20px;}
	.h1stor {font-size:21px; padding:10px 10px 0;}
	.home-hero.hero1 {min-height:inherit;}
	.textbox {width:100%; left:auto; position:relative; top:auto; transform:none; -webkit-transform:none; padding:60px 0 20px;}
	.h2stor {font-size:28px;}
}
