
* { margin: 0; padding: 0; }
BODY,HTML { height: 100%; }
BODY { 
	width: 100%;
	background: #ededed;
	font-family: Arial, Verdana, sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: #333333;
	text-align: left;
	margin: 0; }
.row { position: relative; width: 100%; max-width: 1000px; clear: both; margin: 0 auto; overflow: visible; text-align: left; }
.row .row { width: auto; margin: 0; display: block; }
.column {
    border: 0px solid rgba(0,0,0,0);
    float: left;
    margin: 0;
    padding: 0;
	overflow: visible;
	min-height: 10px;
	position: relative;
	width: 100%;
}

.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}

/************ HTML ************/
a, a:link, a:visited, a:active { color: #62bce7; }
a:hover { text-decoration: underline; }
H1, H2, H3, H4 { font-weight: normal; color: #62bce7; line-height: 24px; font-family: Arial, Verdana, sans-serif; }
H1 { font-size: 24px; margin: 10px 0 10px 0; }
H2 { font-size: 19px; margin: 15px 0 5px; color: #f39100; }
H3 { font-size: 16px; margin: 5px 0; }
H4 { font-size: 14px; margin: 5px 0; }

p, .brodtext, .Normal {
	font-family: Arial, Verdana, sans-serif;
	font-size: 14px;
	color: #333333;
	line-height: 18px;
}
p { margin: 0 0 15px; }

HR { width: 100%; height: 1px; margin: 0; border: 0; border-top: 1px solid #333333; }
IMG { border: none; vertical-align: bottom; max-width: 100%; }

/************ LISTS ************/
OL, UL { margin: 0 0 10px 0; }
OL OL, OL UL, UL OL, UL UL { margin: 6px 0 0 0; padding: 0; }
OL LI, UL LI { margin: 0 15px 10px 15px; padding: 0; }
UL LI { list-style-type: disc; }
OL OL LI, UL OL LI { list-style-type: lower-alpha; }
OL UL LI, UL UL LI { list-style-type: circle; }

/************ HEADER ************/
#header .sommarkurser-fhs { position: absolute; left: 15px; top: 15px; }
#mainmenu .bottom .column { background-color: #6eaa1e; }
#pull { display: none; }

/************ CONTENT ************/
#main .top, #subpage .top { background-color: #ffffff; }
	#main .top .column { padding: 20px 4%; width: 92%; }
	#subpage .top .column { width: 92%; padding: 30px 4%; }
	#main .top .column .Normal { text-align: center; }
	#main .top .column .Normal h1 { font-size: 50px; line-height: 1em; margin-bottom: 20px; }
	#main .top .column .Normal p { font-size: 21px; line-height: 1em; }
	
#main .bottom .column { width: 32%; margin: 20px 1% 0 1%; background-color: #ffffff; }
	#main .bottom .puff1 { margin: 20px 1% 0 0; }
	#main .bottom .puff3 { margin: 20px 0 0 1%; }
	#main .bottom .column h2 { margin: 0; padding: 5px 0; text-align: center; background-color: #f39100; color: #ffffff; display: block; }
	#main .bottom .column h2 .TitleH2 { margin-bottom: 0; }
	#main .bottom .column .Normal { padding: 20px 7%;  }
	#main .bottom .puff1 .Normal { padding: 0; }

/* Iframe */
.iframe-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 35px;
    height: 0;
    overflow: hidden;
}

.iframe-container iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}
	
/************ SKÄRM MINDRE ÄN 815px ************/
@media screen and (max-width: 815px) {  
	#mainmenu .bottom .column { width: 100%; }
} 

/************ SKÄRM MINDRE ÄN 650px ************/
@media screen and (max-width: 650px) {  
	#header .top .column { height: 138px; background: #ffffff; width: 96%; margin: 0 2%; }
	#header .sommarkurser-fhs { position: relative; }
	#header .bg-header { display: none; }

	#mainmenu .bottom .column { width: 96%; margin: 0 2%; }
	
	#main .top, #subpage .top { background-color: transparent; }
	#main .top .column, #subpage .top .column { width: 92%; margin: 0 2%; padding: 20px 2%; background: #ffffff; }
	#subpage .top .column { margin-bottom: 20px; }
	#main .top .column .Normal h1 { font-size: 30px; }
	#main .top .column .Normal p { font-size: 16px; }
	
	#main .bottom .column { width: 96%; margin: 20px 2% 0; }
	#main .bottom .puff3 { margin: 20px 2%; }
	#main .bottom .puff1 .Normal { text-align: center; }
}

/************ SKÄRM MINDRE ÄN 615px ************/
@media screen and (max-width: 615px) {  

} 
/************ SKÄRM MINDRE ÄN 440px ************/
@media screen and (max-width: 440px) {  

} 

