/*===== 

Document:		CSS stylesheet for expon.no
Author: 		Kjetil Sørby, SIKT www.siktweb.no
Created:		juli 2010
Font:			Droid from Google -->Trebuchet MS --> Helvetica --> Arial
Baseline grid:	20px, font-size 14px
Column margins:	20px
Site width:		960px (outer container 980px)
Colors:			#244F91

=====*/


* 					{ margin: 0; padding: 0; }
html, body			{ height: 100%; }
body 				{ font-size: 14px; line-height: 20px; font-family: "Droid Sans", "Trebuchet MS", Helvetica, Arial, Sans-serif; background: url(../graphics/rutenett.png) #e7eef5; }
img 		{ border: none; }
a img 		{ border: none; }


/*=====  TEXT - Expon based on 20px baseline grid =====*/
#nav ul li a		{ font-family: 'Droid Sans', arial, serif; }
h1, h2, h3, h4, h5, h6, p	{ padding-left: 20px; padding-right: 20px; }
h1, h2, h3, h4, h5, h6 	{ color: #000000; font-family: 'Droid Serif', Helvetica,  arial, serif; }
h1 					{ margin-bottom: 20px; font-size: 32px; line-height: 40px; text-transform: uppercase; font-weight: 400; }
h1 small			{ font-size: 12px; color: #cccccc; font-style: italic; }
h1.down				{ margin-bottom: 0; margin-top: 40px; }
h2 					{ margin-top: 10px; margin-bottom: 10px; font-size: 20px; font-weight: 400; text-transform: uppercase;}
h3 					{ margin-top: 20px; font-size: 18px; line-height: 20px; font-weight: 400; text-transform: uppercase;}
h4					{ margin-top: 20px; font-size: 16px; font-weight: 400; }
h6					{ margin-bottom: 0; border-top: 1px solid #cccccc; font-size: 11px; font-weight: 400; line-height: 19px; }
p 					{ margin-bottom: 20px; color: #333333; }
ul, ol 				{ margin-bottom: 20px; margin-left: 40px; }
li 					{ list-style-type: square; }
blockquote p, blockquote 	{ background: none; padding-left: 40px; margin-bottom: 20px; font-family: Georgia, "Times New Roman", serif; font-style: italic; font-size: 20px; line-height: 20px; color: #cccccc;}
p.ingress 			{ font-weight: bold; }
p.infoline			{ font-size: 14px; color: #ffffff; margin-left: -20px; background: #18263D; padding-left: 10px;}
p.infoline span		{ font-size: 11px; color: #cccccc; padding-left: 10px; text-transform: uppercase; }
p.infoline span:first	{ padding-left: 0; }
a {text-decoration: underline; color: #18263d;}

ol 		{ margin-left: 20px; padding-left: 10px;  }
ol li 	{ padding-left: 20px; }



/*=====  Building blocks  =====*/
#mainWrapper			{ margin: 0 auto; width: 960px; background: #ffffff; min-height: 100%; position: relative; overflow: hidden; margin-top: 20px;}
*html #mainWrapper	{ height: 100%; } /*Full height*/

#header				{ height: 100px; width: 960px; position: relative; margin: 0 auto; }
#content, #content_sp { width: 960px; overflow: hidden; }
#footer 			{ height: 80px; margin-top: 40px; background: url(../graphics/footer_logo.jpg) no-repeat top center #ffffff; float: left;  }
#footer p 			{ padding-top: 20px; padding-bottom: 20px;  border-top: 1px solid #cccccc; color: #505559; text-align: center; font-size: 12px; }
#footer p span		{ color: red; }


/*=====  header  =====*/
#logo				{ position: absolute; top: 20px; left: 20px; }
#logo_intro			{ position: absolute; top: 10px; left: 20px; }
#nav				{ position: absolute; top: 20px; right: 20px; }
#nav ul 			{ list-style-type: none; }
#nav li 			{ list-style-type: none; display: inline; }
#nav li a 			{ float: left; text-transform: uppercase; padding: 2px 2px; text-decoration: none; line-height: 20px; color: #244F91; margin-left: 10px; border-bottom: 5px solid #ffffff;;}
#nav li a.current		{ border-bottom: 5px solid #244F91; color: #244F91; }
#nav li a:hover		{ border-bottom: 5px solid #ccc; }
#nav li a.current:hover		{ color: #244F91; cursor: default; border-bottom: 5px solid #244F91; }

/*=====  content  =====*/
/*---  fp  ---*/
#slideshow	{ background: url(../graphics/bg_forside.jpg) bottom left no-repeat; float: left; overflow: hidden; width: 960px; height: 460px; position: relative; }

/*.article_body p:first-line				{ text-transform: uppercase; color: #244F91; padding-left: 20px; }*/
.article_archive img 						{ float: left; }
.article_archive h2, .article_archive p 	{ padding-left: 200px; }
.article_archive .click:hover				{ background-color: #eeeeee; }

.fp_article img 	{ float: left; margin-right: 20px; margin-bottom: 20px; }
.fp_article h1		{ font-size: 24px; }
.fp_article h1 a 	{ text-decoration: none; }
.fp_article h1 a:hover	{ text-decoration: underline; }
.article_body h1	{ margin-bottom: 0; }
.article_body h6	{ margin-bottom: 20px; }
.article_body img 	{ float: right; margin-left: 20px; margin-bottom: 20px; }

.contact p			{ font-size: 12px; }

.sidebar_article p	{ font-size: 12px; }

/*=====  newsroller  =====*/
#newsroller			{ width: 900px; height: 300px; background: white; overflow: hidden; position: absolute; top: 30px; left: 30px;}
#newsroller_content	{ width: 620px; height: 300px; overflow: hidden; float: left; }
#newsroller_content .slide	{ position: absolute; z-index: 0; top: 0; left: 0; width: 620px; height: 300px; background: #fff; }
#newsroller_content .slide.current	{ position: absolute; z-index: 2;  }
#newsroller_content .slide.previous	{ z-index: 1; }
#newsroller_content .slide.ontop	{ z-index: 100; }
#newsroller_content h2 { margin-top: 20px; }
#newsroller_tab		{ width: 280px; height: 300px; overflow: hidden; float: left; }
#newsroller_tab ul 	{ margin: 0; padding: 0; list-style-type: none; }
#newsroller_tab li 	{ margin: 0; padding: 0; display: block; float: left; width: 280px; height: 100px; } 
#newsroller_tab li.tab1	{ background: url(../graphics/bg_tab1.jpg) repeat-x 0 0; }
#newsroller_tab li.tab2	{ background: url(../graphics/bg_tab2.jpg) repeat-x 0 0; }
#newsroller_tab li.tab3	{ background: url(../graphics/bg_tab3.jpg) repeat-x 0 0; }
#newsroller_tab li.tab1.current { background-position: 0 -100px; }
#newsroller_tab li:hover { background-position: 0 -100px; cursor: pointer; }
#newsroller_tab li a { padding-left: 70px; padding-top: 40px; display: block; text-decoration: none; font-weight: bold; color: #ffffff; text-transform: uppercase; font-size: 12px; }

/*=====  wheel  =====*/
#wheel					{ width: 940px; height: 370px; background: url(../graphics/bg_slide.jpg) bottom left repeat-x #eeeeee; overflow: hidden; position: relative; float: left; }
.wheelSlide				{ width: 920px; height: 300px; overflow: hidden; position: absolute; top: 10px; left: 10px; z-index: 0; background: url(../graphics/bg_slide.jpg) repeat-x #f9f9f9; background-position-y: -500px; }
.wheelSlide.current		{ z-index: 2;  }
.wheelSlide.previous	{ z-index: 1;  }
.wheelSlideContent		{ position: absolute; top: 0; left: 0; width: 620px; height: 300px; }
.wheelSlideImg			{ position:absolute; top: 0; left: 620px; width: 300px; height: 300px; }

button.nextBtn, button.pauseBtn, button.playBtn		{ position: absolute; width: 40px; height: 30px; display: block; text-indent: -9999px; border: none; }
button.nextBtn						{ bottom: 10px; left: 100px; background: url(../graphics/next.png) no-repeat; }
button.pauseBtn						{ bottom: 10px; left: 40px; background: url(../graphics/pause.png) no-repeat; }
button.playBtn						{ bottom: 10px; left: 40px; background: url(../graphics/play.png) no-repeat; }
button.nextBtn:hover, button.pauseBtn:hover, button.playBtn:hover		{ cursor: pointer; }


/*=====  HTML5specific  =====*/
article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, title {display: block;}


/*=====  SIKTgrid system - based on 960.gs  Titleist Tour: 6 grids 10px baselinegrid & 960 fullwidth. BLG/Margins of 10px =====*/

.container_6g { width: 960px; margin: 0 auto; position: relative; }
.container { width: 100%; float: left; overflow: hidden; }

.g1, li.g1, .g2, li.g2, .g3, .g4, .g5, .g6 { display: inline; float: left; margin-left: 10px; margin-right: 10px; }

.container_6g .g1, .container_6g li.g1 { width: 140px; }
.container_6g .g2, .container_6g li.g2 { width: 300px; }
.container_6g .g3 { width: 460px; }
.container_6g .g4 { width: 620px; }
.container_6g .g5 { width: 780px; }
.container_6g .g6 { width: 940px; }

.container_6g .pre1 { padding-left: 160px; }
.container_6g .pre2 { padding-left: 320px; }
.container_6g .pre3 { padding-left: 480px; }
.container_6g .pre4 { padding-left: 640px; }
.container_6g .pre5 { padding-left: 800px; }

.container_6g .post1 { padding-right: 160px; }
.container_6g .post2 { padding-right: 320px; }
.container_6g .post3 { padding-right: 480px; }
.container_6g .post4 { padding-right: 640px; }
.container_6g .post5 { padding-right: 800px; }

.container_6g .g1_nomargin { width: 160px; margin-left: 0; margin-right: 0; float: left; display: inline; }
.container_6g .g2_nomargin { width: 320px; margin-left: 0; margin-right: 0; float: left; display: inline; }
.container_6g .g3_nomargin { width: 480px; margin-left: 0; margin-right: 0; float: left; display: inline; }
.container_6g .g4_nomargin { width: 640px; margin-left: 0; margin-right: 0; float: left; display: inline; }
.container_6g .g5_nomargin { width: 800px; margin-left: 0; margin-right: 0; float: left; display: inline; }
.container_6g .g6_nomargin { width: 960px; margin-left: 0; margin-right: 0; float: left; display: inline; }

.container_6g .g1_mr { width: 140px; margin-left: 0; margin-right: 10px; float: left; display: inline; }
.container_6g .g2_mr { width: 300px; margin-left: 0; margin-right: 10px; float: left; display: inline; }
.container_6g .g3_mr { width: 460px; margin-left: 0; margin-right: 10px; float: left; display: inline; }
.container_6g .g4_mr { width: 620px; margin-left: 0; margin-right: 10px; float: left; display: inline; }
.container_6g .g5_mr { width: 780px; margin-left: 0; margin-right: 10px; float: left; display: inline; }
.container_6g .g6_mr { width: 940px; margin-left: 0; margin-right: 10px; float: left; display: inline; }

.container_6g .g1_ml { width: 140px; margin-left: 10px; margin-right: 0; float: left; display: inline; }
.container_6g .g2_ml { width: 300px; margin-left: 10px; margin-right: 0; float: left; display: inline; }
.container_6g .g3_ml { width: 460px; margin-left: 10px; margin-right: 0; float: left; display: inline; }
.container_6g .g4_ml { width: 620px; margin-left: 10px; margin-right: 0; float: left; display: inline; }
.container_6g .g5_ml { width: 780px; margin-left: 10px; margin-right: 0; float: left; display: inline; }
.container_6g .g6_ml { width: 940px; margin-left: 10px; margin-right: 0; float: left; display: inline; }

.container1	{ float: left; width: 160px; }
.container2 { float: left; width: 320px; }
.container3	{ float: left; width: 480px; }
.container4 { float: left; width: 640px; }
.container5	{ float: left; width: 800px; }
.container6 { float: left; width: 960px; }

.alpha { margin-left: 0; }
.omega { margin-right: 0; }

.shadow {
  box-shadow: 5px 5px 5px #ccc;
  -moz-box-shadow: 5px 5px 5px #ccc;
  -webkit-box-shadow: 5px 5px 5px #ccc;
}

.shadow2 {
  box-shadow: 3px 3px 3px #444;
  -moz-box-shadow: 3px 3px 3px #444;
  -webkit-box-shadow: 3px 3px 3px #444;
}


.roundbox { 
    background-color: #991a37;          /* if needed */
    -webkit-border-radius: 20px;    /* for Safari */
    -moz-border-radius: 20px;       /* for Firefox */
    overflow: hidden;
	padding: 18px;
	-moz-box-shadow: 3px  3px 3px #666;
	-webkit-box-shadow: 3px 3px 3px #666;
	box-shadow: 3px 3px 3px #666;
 }
 
 /*=====  Improved version of the clearfix method: perishablepress.com  =====*/
.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
      }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }

/*=====  MISC  =====*/
.hidden 		{ display: none; }
.pushdown10, .pd10 	{ margin-top: 10px; }
.pushdown20, .pd20 	{ margin-top: 20px; }
.pushdown40, .pd40 	{ margin-top: 40px; }
.pushdown50, .pd50 	{ margin-top: 50px; }
.mb20 			{ margin-bottom: 20px; }
.mb40 			{ margin-bottom: 40px; }

.clear_left 	{ clear: left; }
.clear 			{ clear: both; }
.clear_right 	{ clear: right; }
.left			{ float: left; }
.right			{ float: right; }

.click			{ overflow: hidden; padding-bottom: 20px; margin-bottom: 20px; }
.click:hover	{ overflow: hidden; padding-bottom: 20px; cursor: pointer; }
.overview .click		{ border-bottom: 10px solid #333333; padding-bottom: 0; }
.overview .click:hover	{ border-bottom: 10px solid #999999; }

a.backlink		{ background: #dddddd; color: #244F91; padding: 5px; text-decoration: none; }
a.backlink:hover	{ background-color: #244F91; color: white;  -moz-box-shadow: 3px  3px 3px #aaa; -webkit-box-shadow: 3px 3px 3px #aaa; }

a.download_doc	{ background: url(../graphics/download.png) no-repeat 5px 10px #dddddd; color: #244F91; padding: 10px 10px 10px 30px; 	-moz-box-shadow: 3px  3px 3px #666; -webkit-box-shadow: 3px 3px 3px #666; -webkit-border-radius: 3px; -moz-border-radius: 3px; text-decoration: none; margin-left: 20px; }
a.download_doc:hover	{ background-color: #244F91; color: #ffffff; }

.sidebar_header	{background: #244F91;}
.sidebar_header span	{background: #fff; padding: 5px 10px 5px 10px;}

a.les_mer	{ background: #244F91; color: #ffffff; padding: 3px 5px; 	-moz-box-shadow: 3px  3px 3px #ccc; -webkit-box-shadow: 3px 3px 3px #ccc; -webkit-border-radius: 3px; -moz-border-radius: 3px; text-decoration: none; font-size: 12px; text-transform: uppercase; }
a.les_mer:hover	{ background-color: #ccc; color: #244F91; }

.login a				{ background: url(../graphics/login.jpg); display: block; width: 140px; float: left; font-size: 12px; text-decoration: none; height: 30px; padding-top: 10px; text-align: center; -webkit-border-radius: 3px; -moz-border-radius: 3px; background-position-x: 0; }
.login a.first_login	{ margin-right: 20px; }
.login a.last_login	{ margin-top: 10px; width: 300px; }
.login a:hover			{ background: #77ab31; color: white; }
.login p		{ padding: 0; }
