/*
 960 Grid System ~ Text CSS.
 Learn more ~ http://960.gs/
 
 Licensed under GPL and MIT.
 */

/* `Backgrounds
 ----------------------------------------------------------------------------------------------------*/

html {
    height: 100%;
}
body {
    background: url('images/background_youtube.png');
    background-repeat: repeat;
    height: 100%;
    
    font: 13px/1.5 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
}

#container {
    height: auto; 
	padding-bottom: 37px;
}

#main {
    padding-right: 10px;
    height: auto;
    min-height: 850px;
}

/* Layout classes (to use on many elements)
 ----------------------------------------------------------------------------------------------------*/
.bg_white_60 {
    /* Fallback for web browsers that doesn't support RGBa */
    background: #f7f7f7;
    /* RGBa with 0.6 opacity */
    background: rgba(255, 255, 255, 0.6);
}

.bg_white_100 {
    Background: #fff;
}

.box_header {
    height: 37px;
    margin-bottom: 20px;
}

.box_blue {
    background-color: #42A3BF;
}

.box_orange{
    background-color: #D17842;
}

.box_yellow {
    background-color: #E7AE47;
}

.leftadjust {
	margin-left: 15px;
}

.mega_leftadjust {
	margin-left: 18px;
}

.bild{
	margin-top: 10px;
	margin-left: 10px;
}

.bild2{
	margin-top: 10px;
	margin-left: 30px;
	margin-right: 10px;
	float: right;
}

.bluebell{
	color: #42A3BF;	
}

.blue_back{
	background-color: #42A3BF;	
}

#content_page img {
	height:auto; /* preserve aspect ratio */
	max-width: 90%;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 5%;
    margin-right: 5%;
}

#main_slideshow img {
	max-width: 100%;
	height:auto; /* preserve aspect ratio */
}

/*
img.resize{
    width:540px;
    height: auto;
	margin-top: 10px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
}*/

	

.mob_nav li{
	display: blocks;
	height: 33px;
	width: 95%;
	float: left;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 12px;
}

/* `DIV Layout (from top to bottom, and right to left where applicable. When children => dealt with later)
 ----------------------------------------------------------------------------------------------------*/
div #header {
    height: 130px;
}

div #logo_holder{
	padding-top: 16px;
}

div #contact{
	padding-top: 16px;
}

div #navigation_holder{
	background-color: white;
	width: 100%;
	min-height: 30px;
}

div #main{
}

div #main_content {
    float: left;
    margin-top: 20px;
    margin-bottom: 20px;
	background-color: white;
	min-height: 850px;
}

div #content_page {
	min-height: 100%;
}

div#the_content {
    padding-bottom: 10px;
    margin-bottom: 40px;
	height: auto;	
}

div #main_slideshow {
	float: left;
	background-color: white;
    margin-top: 20px;
    margin-bottom: 20px;
	width: 100%;
	min-height: 300px;
}

div #main_subcontent {
    margin-top: 10px;
}

div #main_infobox1_content, 
    #main_infobox2_content, 
    #main_infobox3_content {
    height: 425px;
    padding-bottom: 12px;
	margin-bottom: 24px;
}

div #kontakt_bild {
	width: 120px;
	display: inline;
}

div #kontakt_text {
	width: 170px;
	float: right;
	display: inline;
	margin-top: 10px; 
}

#sub_meny, #sub_offer, #sub_contact{
	/*background-color: white;*/
	min-height: 20px;
	margin-top: 20px;
	height: auto;
}

#sub_meny_content {
	height: auto;
	overflow: hidden;
}

#bottom_navigation_holder, #mini_sub_offer, #mini_sub_contact{
	display: none;
	margin-bottom: 10px;
}

/* Layout changes for smaller screen */	

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

	div#header {
		height: 90px;
		margin-left: 10px;
	}

	#body, #container, #header, #main, #main_subcontent{
		min-width: 5px;
		width: 100%;
		max-width: 640px;
		float: left;
		padding-right: 0px;
		overflow: hidden;
	}
	
	
	#contact, #main_slideshow , #navigation_holder, #sub_offer, #sub_contact{
		display: none;
	}
	
	#side_bar{
		width: 100%;
		display: block;
	}
	
			
	#main_infobox1, #main_infobox2, #main_infobox3, #sub_meny, #mini_sub_offer, #mini_sub_contact, #main_content{
		display: block;
		width: 95%;
		margin-right: 10px;
		margin-left: 10px;
		height: auto;
		overflow: hidden;
	}
	
	#main_content {
		min-height: 0px;
	}
	
	div#main_infobox1_content, #main_infobox2_content, #main_infobox3_content {
		height: auto;
	}

	#main_headline, #content_page{
		width: 100%;
	}	
	
	#bottom_navigation_holder{
		display: block;
		width: 100%;
		height: auto;
		overflow: hidden;
	}
	
}