/* 	--- TEST V 1.1
	For mobile phones: 700 px täcker upp även liggande format - stående kanske 400? 
	
	komplex layout:
	
	för att kunna sätta padding på objekt och samtidigt ha 100% bredd på yttre div
	har vi nu en wrapper .maincol_obj på alla yttre object i container som är 100%	
	i den en inre oklassad div som får 20px padding
	
*/

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


/* --- ÄNDRINGAR FRÅN B*CMS */
	
	/* visa el dölj vissa delar - blogg o textarkiv */
	
	#heading-mob {display:block;}
	.blog-sidebar {display:none;}
	.blog-arkiv {display:none;}
	
	/* gör alla 100% */
	
	#maincol, #rightcol,#midcol,#txtram,#txtram2,#widecol, #wideimg,#wideimg img, #heading-article {
	width: 100%;
	}
	#rightcol {width:0%;float:left;}


	
	/* bildram för småbilder article -  padding: 20px; */
	
	.bildram, .bildram_h {width: 45%; min-width:10px;}
	.bildram_h {float:left;}
	.bildram_vert {width: 100%; min-width:10px; float:left; margin-bottom: 20px;}
	
	/* bildram category! OLD NIU 
	 padding: 20px;
	
	#bildram_first, #bildram_first_h {width: 40%; min-width:10px;}
	#bildram_first_h {float:left;}*/
	
	/* 	
		flödar bildrader nedåt - skiftar padding från left till top 
		tar bort padding på bildrader (anv ej här)	
		.bildrad{width:100%; padding:40px 40px 0px;}
	 */
	
	/* tumnaglar påverkas inte - bara article tpl2 */
	
	[class*="bildcol-"] {width: 100%;}
	[class*="bildcol-"].bildcol-pad {padding-left:0px; padding:60px 0; margin-left:0%;}
	[class*="bildcol-"].bildcol-pad-r {padding-left:0px;padding-top:0px;}
	[class*="bildcol-"] h5 {margin-top: 30px;}
	
	
/* ----- WARMEM LAYOUT */

/* ----- textjusteringar */
	
	body {font-size:100%;}
	h1 {font-size:32px; line-height:125%;} 
	h3 {font-size:24px;} 
	
	/* funkar inte bra
	h3, .rubcatl {padding:0 20px;}
	*/
	 
	
/* ----- YTTRE LAYOUT (footer längre ned) */
			
	/* andra justeringar */
	#container, #headcont {padding: 0;}
	
	/* headcont menu skall fylla ut */
	#topcont, #headcont, #menu, #container, #footer {width: 100%; margin:0 auto;}
	
	/* headcont img minskas */
	div#headcont img {width: 30%; height:auto; margin:10px;}	
		
	
/* ----- CONTENT MAINCOL SIDEBARS */
	
	/* ny maincol - fyller ut nästan med lite padding */
	.maincol, .maincol.w500, .maincol.semi-wide, .maincol.fullwidth, div.sidebar.noresp {width: 90%; margin:0 auto; padding:0 4%;}	
	
	/*.maincol {width: 90%; margin:0 auto; padding:0 4%;}*/
	
	/* ny maincol - avstånd till nästa övre */
	.maincol, .maincol.semi-wide, .maincol.fullwidth {
	margin-top:40px;
	}	

	/* special för mem virt som inte ska ha padding */
	.maincol.fullwidth.nopad {width: 100%; margin:0 auto; padding:0;}	

	/* resten måste ha marginal th */
	div#topimg, div#memimg, #disclaimer, #disclaimer_below, #infotxt, #txt, .infotxt.factbox, .infotxt
	{
	width: 100%; margin:0 auto;
	}


	/* alla bilder 100% utom bg-bilder? */	
	#maincol img, .maincol img:not(.noscaling) { width: 100%; height: auto; }


/* ----- NY SIDEBAR - responsiv med knapp
	
	.sidebar.sidemenu 
	{
	position:absolute;
	top:0px;
	left:0px;
	border-left:1px solid #ccc;
	}
	*/

	/* - om vi har sidebar noresp visas den längst ned - se ovan för css */
	 
	/* 
	OBS! denna bevarar home 
	div.topnav div:not(:first-child) {display: none;}
	och denna döljer bara den första div:first-child {display: none;}
	men måste vara mer exakt?
	*/
	
	div.sidebar div.sidebar-content {display: none;}
	div.sidebar div.icon {
	float: left;
	display: inline-block;
	position: absolute;
	right: 0;
	top: 0;
	}

	/*div.topnav.responsive {position: relative;}*/
	
	div.sidebar.responsive div.icon {
	position: absolute;
	right: 0px;
	top: 0px;
	z-index:1000;
	}
	
	/* obs! måste ha namngiven klass 
	funkar inte med 2col eftersom alla får position absolute och därmed hamnar på varandra
	*/
	
	div.sidebar.responsive div.sidebar-content {
	float: none;
	/*display: inline;*/
	display: inline-block;
	position: absolute;
	right: 0px;
	top: 0px;
	width:60%;
	text-align:left;
	background-color: #fff;
	z-index:999;
	padding:10px;
	padding-top:48px;
	border:1px solid #eee;
	}

 	div.sidebar-content-item {
	float: none;
	width:100%;
	}

 	div.sidebar-content-item:first-child {
	margin-right:0px;
	}



/* ----- CONTENT BOXES IN MAINCOL */

	/* --- ITEMS wraps all items in maincol - med underline*/
	.maincol_obj 
	{
	width: 100%; margin:0 auto; padding:0;
	border-bottom:1px solid #eee;
	}
	
	/* inre div får padding */
	.maincol_obj div 
	{
	padding:20px;
	}
	
	/* grå bg i mobile */
	.maincol_obj.txtbox 
	{
	background-color:#eee; 
	}

	/* linjerar ovan box - bara i mobil - om den är satt som alternativ */
	
	.maincol_obj.line-none
	{
	border-top-width:1px;
	}
	

/* ----- CONTENT BOXES OMC */
	
	/* --- OMC detail page padding kan ställa till med problem? */
	#disclaimer, #disclaimer_below, #infotxt, #infotxt, #txt {padding:0px;}

	/* bort med border och färg */
	#disclaimer, #disclaimer_below {border:0px; background-color:#fff;}

	/* inforutor i mem_virt med olika bg */
	.infotxt.factbox, .infotxt {background-color: none; border-width:0px; padding:0px;}

	/* warmem specials */
	
		/*
	test med multicol för infotext
	http://www.w3schools.com/css/css3_multiple_columns.asp
	
	*/
	
	.infotxt {
	
	    -webkit-column-count: 1; /* Chrome, Safari, Opera */
    	-moz-column-count: 1; /* Firefox */
    	column-count: 1;
	}
	

/* ----- FOOTER

	footer anv i tpl - bg container*/	

	div#footer 
	{
	margin-top:20px;
	height:240px;
	width:100%;
	padding:0;
	background-color:#FFF;
	}
	
	/*footer anv i tpl*/	
	.foot-cont 
	{ 
	width:100%;
	margin-right:auto;
	margin-left:auto;
	margin-top: 40px;
	padding: 20px 0px;
	text-align:center;
	}
	
	.foot-cont div {float:left; width:100%;margin-right:0%;}
	.foot-cont div:last-child {clear:both; width:100%;}
	.foot-cont div div {width:100%; float:left; margin-right:0px;}
	.foot-cont div div:last-child {clear:both;}


	
/* ----- MENU NY NAV */

	/* ändringar av meny #nav li {} */
	
	#menu  {
	height:66px;
	padding:0;
	}
	
	#nav, #nav ul { font-size:14px; }

	#nav li:first-child {
	padding-left:0px;
	border-left:1px solid #ccc;
	}

	#nav li ul { 

	position: absolute;	
	width: 100%; /* minska pga padding */
	/* using left instead of display to hide menus */
	left: -999em;
	background: #fff;
	border:1px solid #ccc;
	border-top:0px;
	/*border-right:1px solid #ccc;*/
	padding: 0px 0px;
	margin: 0px 0 0 0px;

	/* 
	testar kolumner här - då ska inte li ul li flyta!
	http://www.w3schools.com/css/css3_multiple_columns.asp
	*/
	
	-webkit-column-count: 1;
	-moz-column-count: 1;
	column-count: 1; 
			
	}

}