/* 
Stilark for Voss Gymnas Websider
Produsert av Olav Øyen for Molecule Digital Agency
http://www.molecule.no/

Hovedstiler med tabeller og skjema
Søkbare stikkord i toppen, kategorisert etter plassering.

Stilarket er strukturert etter plassering og alfabetiske stiler.
*/

/* Reset */

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,
pre, form, fieldset, table, th, td { margin: 0; padding: 0; }

/* Fontfacer */

@font-face {
	font-family: 'CenturyGothicRegular';
	src: url('Century_Gothic.eot');
	src: local('Century Gothic Regular'), local('CenturyGothic'), url('Century_Gothic.woff') format('woff'), url('Century_Gothic.ttf') format('truetype'), url('Century_Gothic.svg#CenturyGothic') format('svg');
}

@font-face {
	font-family: 'CenturyGothicBold';
	src: url('Century_Gothic_Fett.eot');
	src: local('Century Gothic Bold'), local('CenturyGothic-Bold'), url('Century_Gothic_Fett.woff') format('woff'), url('Century_Gothic_Fett.ttf') format('truetype'), url('Century_Gothic_Fett.svg#CenturyGothic-Bold') format('svg');
}

@font-face {
	font-family: 'CenturyGothicItalic';
	src: url('Century_Gothic_Kursiv.eot');
	src: local('Century Gothic Italic'), local('CenturyGothic-Italic'), url('Century_Gothic_Kursiv.woff') format('woff'), url('Century_Gothic_Kursiv.ttf') format('truetype'), url('Century_Gothic_Kursiv.svg#CenturyGothic-Italic') format('svg');
}
/* Grunnstiler html, body, globale stiler*/

html {}

body {
  background:  url(../img/bg-body.jpg) repeat-x #0e0e0e;
  font-family: "CenturyGothic", "CenturyGothicRegular", Helvetica, Arial, sans-serif;
  text-align: center;
  }
  
img { 
	behavior: url(../../side/iepngfix.htc);
	border: none;
	}

h1 { 
	font-size:34px;
	font-weight: normal;
	line-height: 40px;
	margin-bottom: 10px;
}

h2 { 
	font-size:20px;
	font-weight: normal;
	line-height: 30px;
}

h3 { 
	font-size:18px;
	font-weight: lighter;
	line-height: 24px;
}

h4 { 
	font-size:16px;
	font-weight: normal;
	line-height: 20px;
}

h5 { 
	font-size:14px;
	font-style: normal;
	line-height: 20px;
}

p { 
	font-size:14px;
	line-height: 24px;
	letter-spacing: 0,5px;
}

.green { color: #9dc838 }

a:link {
	text-decoration: none;
	color: #9dc838;
}

a:visited {
	text-decoration: none;
	color: #9dc838;
}

a:hover {
	text-decoration: underline;
	color: #9dc838;
}

a:active {
	text-decoration: none;
	color: #9dc838;
}

.floatleft { float: left; }
.floatright { float: right; }

/* wrapper */

div#custombg {
	background: url(../img/bg-custom.png) no-repeat center top;
	width: 100%;
	min-width: 954px;
	height: 100%;
}

div#wrapper { 
	margin: 0 auto; 
	height: auto; 
	width: 954px; 
	}
	
/* header */
	
div#header {
	padding: 0 15px 0 45px;
	text-align: left;
	height: 90px;
	width: 890px;
	margin: 0 auto;
}

div#header .logo {
	float: left;
	width: 200px;
	padding: 25px 0 0;
}

div#header .meny {
	float: right;
	width: 515px;
	padding: 52px 0 0;
	text-align: right;
}

/* 
	ØVERSTE NIVÅ
*/
ul.dropdown                         { position: relative; list-style: none; display: block; clear: both; }
ul.dropdown li                      { font-size: 12px; margin: 0 0 0 25px; text-decoration: none; letter-spacing: 1px; width: auto; float: left; }
ul.dropdown a:hover		            { color: #9dc838; text-decoration: none; }
ul.dropdown a:active                {  }
ul.dropdown li a                    { display: block; color: #e8e8e8; }
ul.dropdown li:last-child a         { border-right: none; } /* Doesn't work in IE */
ul.dropdown li.hover,
ul.dropdown li:hover                { background: none; color: #9dc838; position: relative; }
ul.dropdown li.hover a              { }


/* 
	UNDERNIVÅ 1
*/
ul.dropdown ul 						{ width: 120px; color: #e8e8e8; visibility: hidden; position: absolute; top: 100%; left: 0; background: url(../img/bg-dropdown.png) repeat-x; padding: 10px 0 5px 20px; }
ul.dropdown ul li 					{ font-weight: normal; font-size: 11px;  color: #e8e8e8; border-bottom: none; float: none; text-align: left; list-style: none; margin: 0 0 5px 0;}
									  
                                    /* IE 6 & 7 Needs Inline Block */
ul.dropdown ul li a					{ border-right: none; width: 100%; display: inline-block; }

/* 
	UNDERNIVÅ 2
*/
ul.dropdown ul ul 					{ left: 100%; top: 0; }
ul.dropdown li:hover > ul 			{ visibility: visible; }


/* bigbox */

div#bigbox {
	clear: both;
	text-align: center;
	width: 954px;
	height: 442px;
	margin: 0 auto 10px;
	overflow: hidden;
}	

div#bigbox .kontrollar {
	position: absolute;
	top: 476px;
	width: 953px;
	padding: 0;
	height: 32px;
	background: none;
	float: left;
}

/* white container */

div.whitecontainer-top {
	clear: both;
	width: 954px;
	height: 17px;
	margin: 0 auto;
	background: url(../img/bg-container-top.png) no-repeat;
}

div.whitecontainer-center {
	width: 914px;
	margin: 0 auto;
	background: url(../img/bg-container-center.png) repeat-y;
	padding: 10px 20px;
	text-align: left;
}

div.whitecontainer-bottom {
	clear: both;
	width: 954px;
	height: 17px;
	margin: 0 auto 10px;
	background: url(../img/bg-container-bottom.png) no-repeat;
}

/* white container */

div.blackcontainer-top {
	width: 954px;
	height: 17px;
	margin: 0 auto;
	background: url(../img/bg-blackbox-top.png) no-repeat;
}

div.blackcontainer-center {
	width: 914px;
	margin: 0 auto;
	background: url(../img/bg-blackbox-center.png) repeat-y;
	padding: 10px 20px;
	text-align: left;
}

div.blackcontainer-bottom {
	clear: both;
	width: 954px;
	height: 17px;
	margin: 0 auto 10px;
	background: url(../img/bg-blackbox-bottom.png) no-repeat;
}

/* doublebox */

div.dooublebox-l {
	width: 393px;
	float: left;
	height: auto;
	padding: 10px 30px 0;
}

div.dooublebox-r {
	width: 393px;
	float: right;
	height: auto;
	padding: 10px 30px 0;
	text-align: justify;
}

.dooublebox-r h2,
.dooublebox-l h2 {
	text-align: left;
}

.dooublebox-r p,
.dooublebox-l p {
	text-align: justify;
}

/* doublebox-arbeid */

div.arbkontainer {
	width: 914px;
	height: 300px;
	margin: 0 auto;
	padding: 10px 20px;
	text-align: left;
}

div.dooubleboxa-l {
	width: 393px;
	float: left;
	height: 100%;
	padding: 10px 30px 0;
	text-align: center;
}

div.dooubleboxa-r {
	width: 393px;
	float: right;
	height: 100&;
	padding: 15px 30px 0;
	text-align: justify;
	color: #f6f6f6;
}

/* triplebox */

div#triplebox {
	width: 954px;
	height: auto;
	height: 240px;
}	

div#triplebox .box {
	width: 270px;
	float: left;
	height: 200px;
	text-align: left;
	padding: 23px;
	background: url(../img/bg-triplebox-top.png) no-repeat center top;
	
}

div#triplebox .box-nobg {
	width: 268px;
	float: left;
	height: 180px;
	text-align: left;
	padding: 23px;
	color: #fff;
	
}

div#triplebox .arbeid-box {
	width: 314px;
	float: left;
	height: 260px;
	
}

div#triplebox .boxend {
	width: 270px;
	float: left;
	text-align: center;
	padding: 0 23px;
	height: 10px;
	background: url(../img/bg-triplebox-end.png) no-repeat center top;
	margin: 0 0 4px 0;
	
}

/* Easy Slider */

	#slider ul, #slider li,
	#slider2 ul, #slider2 li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider2{margin-top:0;}
	#slider li, #slider2 li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:954px;
		height:442px;
		overflow:hidden; 
		}	

/* footer */

div#footer {
	clear:both;
	height: 20px;
	text-align: right;
	width: 945px;
	margin: 10px auto;
}

div#footer p {
	font-size: 10px;
	color: #fff;
}

/* forms */

input, textarea { padding: 5px; font-size: 12px; }
.eighty { width: 80%; background: #fff;  border: none;}