@import "reset.css";
@import "ui.stars.css";

body {
	font: 100% "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", "Lucida", sans-serif;
  color: #222;
  background: url(../images/page-bg.jpg) repeat top left fixed;
}

body.font-verdana { font-family: verdana, sans-serif; }
body.font-arial { font-family: arial, sans-serif; }
body.font-times { font-family: "times new roman", serif; }
body.font-courier { font-family: courier, sans-serif; }

body.size-smaller { font-size: 80%; }
body.size-bigger { font-size: 110%; }
body.size-biggest { font-size: 120%; }

body.lineheight-bigger { line-height: 2; }
body.lineheight-biggest { line-height: 3; }

body.contrast-high { color: #000; }
body.contrast-high div#content a { color: #0000ff; }

/* containers */

div#container {
  width: 960px;
  margin: 0 auto;
}

div#top {
  width: 960px;
  color: #fff;
  background-color: #444;
}

div#header {
  position: relative;
  width: 900px;
  height: 80px;
  padding: 30px;
  background-color: #fff;
}

div#content {
  width: 900px;
  padding: 20px 30px;
  background-color: #fff;
}

div#footer {
  width: 920px;
  padding: 20px;
  font-size: 90%;
  text-align: center;
  color: #fff;
}

/* columns */

div#main {
  float: left;
  width: 620px;
  margin-right: 30px;
  overflow: hidden;
}

div#sidebar {
  float: left;
  width: 250px;
}

div#full {
	width: 900px;
}

/* elements */

div#settings {
  display: none;
  padding: 10px 30px;
  background: #555 url(../images/top-bg.png) repeat-x top left;
}

div.sidebar-box {
  width: 230px;
  padding: 10px;
  line-height: 1.5;
  margin-bottom: 20px;
}

div.sidebar-box.gray { background-color: #c1c3c2; }

div.sidebar-box.gray:hover { background-color: #444; }

div.sidebar-box.yellow { background-color: #fff799; }

div.sidebar-box.yellow:hover { background-color: #e4dc83; }

div.sidebar-picture-box { margin-bottom: 20px; }

div#player {
	float: left;
	width: 480px;
}

/* video elements */

div#video-description {
	float: left;
	width: 400px;
	margin-left: 20px;
}

div.video-item {
	float: left;
	width: 160px;
	margin: 0 25px 20px 0;
}

div#rating {
  position: relative;
  height: 18px;
  clear: left;
  top: 10px;
  border: 1px solid #ccc;
  padding: 5px 10px;
  font-size: 81.25%;
}

div#rating span#rate {
  position: absolute;
  top: 5px;
  left: 10px;
  font-weight: bold;
}

div#rating form.ratingForm {
  position: absolute;
  top: 5px;
  left: 90px;
}

div#rating span#votes {
  position: absolute;
  top: 5px;
  left: 190px;
}

div#rating span#views {
  position: absolute;
  top: 5px;
  right: 10px;
}

div.video-item.first-video { clear: left; }

div.video-item.last-video { margin-right: 0; }

/* 10 questions */

div.ten-questions div.question-wrapper,
div.ten-questions div.question-wrapper p.feedback,
div.ten-questions div.question-wrapper p.score {
  display: none;
  font-size: 130%;
}

/*div.ten-questions div#results { display: block; }*/

div.ten-questions .bar {
  width: 200px;
  height: 20px;
  text-indent: -999em;
  background: #ff7e00 url(/gfx/bar.gif) no-repeat 0 0;
}

div.ten-questions .barcomment{
  float:right;
  font-size: 65%;
  width: 330px;
  margin:0;
  padding:0;
}





div.ten-questions div.question-wrapper span.response { display: none; }

div.ten-questions div.question-wrapper {
  border: 2px dashed #cbb79e;
  background-color: #fff4df;
  padding: 20px 20px 30px 20px;
  margin-top:20px;
}

div.ten-questions div.question-wrapper p.feedback { cursor: pointer;   }

div.ten-questions div.question-wrapper p.feedback.wrong { color: #993f31;   }

div.ten-questions div.question-wrapper p.feedback.right { color: #709931;   }

div.ten-questions div.question-wrapper p.feedback span.next {
  font-weight: bold;
  color: #000;
}

div#main div.question-wrapper p {
  margin: 0 0;
}

div.ten-questions p span.number {
  font-size: 120%;
}

div.ten-questions p span.text {
  font-size: 120%;
  margin-bottom:5px;
}

div.ten-questions label {
  display: block;
  position: relative;
  line-height: 1.5;
  padding: 20px 0 0 26px;
  cursor:pointer;
}

div.ten-questions label input {
  position: absolute;
  top: 28px;
  left: 0;
}

div.ten-questions label:hover {
font-weight:bold;
}

/* Benchmark */
.bardescription {
  float:left;
  font: 11px "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", "Lucida", sans-serif;
  padding: 0;
  color: #000;
  width:160px;
}

.bardescription2 {
  float:left;
  font: 11px "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", "Lucida", sans-serif;
  padding: 0;
  color: #000;
  width:80px;
}


/* logo */

p#logo {
  position: absolute;
  top: 15px;
  left: 30px;
}

p#logo a {
  display: block;
  width: 399px;
  height: 69px;
  background: url(../images/allt-om-stad-logo.png) no-repeat top left;
  text-indent: -999em;
}

/* navigation */

div#navigation {
  width: 900px;
  position: absolute;
  left: 30px;
  bottom: 0;
  padding-bottom: 10px;
  font-size: 81.25%;
  border-bottom: 4px solid #a49f99;
}

div#navigation li,
div#navigation a {
  display: block;
  float: left;
}

div#navigation a {
  padding: 6px 15px;
  color: #000;
  text-decoration: none;
  text-transform: uppercase;
}

div#navigation a:hover,
div#navigation li.active a,
div#navigation li.dir-active a,
div#navigation li.dir-open a {
  color: #fff;
  background-color: #686362;
}

/* sidebar navigation */

ul.sidebar-navigation { margin: 10px 0 30px 0;}

ul.sidebar-navigation li { font-size: 80%;  }

ul.sidebar-navigation a {
  display: block;
  padding: 4px 10px 8px 20px;
  border-bottom: 1px solid #e5e5e5;
}

ul.sidebar-navigation li li a { padding-left: 40px; }
ul.sidebar-navigation li li li a { padding-left: 40px; }

ul.sidebar-navigation li li { font-size: 100%; }

ul.sidebar-navigation li.dir a { background: url(/gfx/dir.png) no-repeat 5px 13px; }
ul.sidebar-navigation li.dir-active a,
ul.sidebar-navigation li.dir-open a { background: url(/gfx/dir-open.png) no-repeat 5px 13px; }

/* cancel background on following items */
ul.sidebar-navigation li.dir-active li a,
ul.sidebar-navigation li.dir-open li a,
ul.sidebar-navigation li.dir-open li.dir-active li a { background-image: none; }

/* reset background on following items */
ul.sidebar-navigation li.dir-active li.dir a,
ul.sidebar-navigation li.dir-open li.dir a { background: #fff url(/gfx/dir.png) no-repeat 15px 13px; }

/* active directory in directory */
ul.sidebar-navigation li.dir-open li.dir-active a { background: url(/gfx/dir-open.png) no-repeat 15px 13px; }
ul.sidebar-navigation li.dir-open li.dir-open a { background: url(/gfx/dir-open.png) no-repeat 15px 13px; }

ul.sidebar-navigation li.active,
ul.sidebar-navigation li.dir-active { background-color: #e5e5e5; }

ul.sidebar-navigation li.dir-active li { background-color: #fff; }
ul.sidebar-navigation li.dir-active li.active { background-color: #e5e5e5; }
ul.sidebar-navigation li.dir-open li.dir-active { background-color: #e5e5e5; }

div#content ul.sidebar-navigation a:hover {
  color: #fff;
  background-color: #686362;
  text-decoration: none;
}

div#content ul.sidebar-navigation li.dir a:hover { background-image: url(/gfx/dir-hover.png); }
div#content ul.sidebar-navigation li.dir-active a:hover,
div#content ul.sidebar-navigation li.dir-open a:hover,
div#content ul.sidebar-navigation li.dir-open li.dir-open a:hover { background-image: url(/gfx/dir-open-hover.png); }
div#content ul.sidebar-navigation li.dir-open li.dir a:hover,
div#content ul.sidebar-navigation li.dir-active li.dir a:hover { background-image: url(/gfx/dir-hover.png); }

div#content ul.sidebar-navigation li.dir li a:hover,
div#content ul.sidebar-navigation li.dir-open li a:hover,
div#content ul.sidebar-navigation li.dir-active li a:hover,
div#content ul.sidebar-navigation li.dir-open li.dir-open li.active a { background-image: none; }

div#content ul.sidebar-navigation li.dir-open li.dir-active a:hover { background-image: url(/gfx/dir-open-hover.png); }

div#content ul.sidebar-navigation li.dir-open li.dir-active li a:hover { background-image: none; }

/* search */

div#search {
  position: absolute;
  top: 40px;
  right: 30px;
}

/* text */

/*Huvudrubrik*/
h1 {
  font: 270% georgia, "times new roman", serif;
  margin: 12px 0;
}

h2.header {
  font-size: 90%;
  padding: 4px 10px;
  font-weight: bold;
  text-transform: uppercase;
  border-bottom: 2px solid #a49f99;
}

/*Ingress*/
h3 {
  font: 1.1em/1.6em georgia, "times new roman", serif;
	margin: 0.2em 0 0.5em 0;
	color:#444;
}

/*Underrubrik*/
h4 {
  font: 150% georgia, "times new roman", serif;
  margin: 26px 0 12px 0;
}

/*Underrubrik mindre*/
h5 {
  font: 140% georgia, "times new roman", serif;
  margin: 26px 0 12px 0;
}

div.sidebar-box h3 {
  font-size: 180%;
  font-weight: bold;
  font-style: italic;
  margin: 0;
  text-transform: uppercase;
}

div.sidebar-picture-box h3 {
  font: 140% georgia, "times new romans", serif;
}

div#settings p {
  font-size:81.25%;
  line-height:170%;
  margin-bottom:12px;
}

div#settings p.header { font: 140% georgia, "times new roman", serif; }

div#main p,
div#full p {
  font-size:81.25%;
  line-height:170%;
  margin: 12px 0;
}

div#full div.video-item p { font-size: 68.75%; line-height: 150%; margin: 0; }

div.sidebar-picture-box p {
  font-size:81.25%;
  line-height:170%;
}

em {
  padding:3px 4px;
  background-color: #fff799;
}

strong {
font-weight:bold;
}

div#search p { display: inline; }

/* lists */

div#main ul,
div#main ol {
  font-size:81.25%;
  line-height:170%;
  margin-bottom: 15px;
}

div#main table ul,
div#main table ol { font-size: 1em; }

div#main ul li {
  list-style: disc outside;
  margin: 0 0 10px 30px;
}

div#main ol li {
  list-style: decimal outside;
  margin: 0 0 10px 30px;
}

div#main ul ul { font-size: 100%; }

div#footer li,
div#top li {
  display: inline;
  margin-right: 10px;
}

div#footer li:last-child { margin-right: 0; }

div#top ul#top-links {
  display: block;
  text-align: right;
  font-size:81.25%;
  padding: 6px 20px;
}

div#top ul#top-links a {
  color: #fff;
  font-style: italic;
  text-decoration: none;
  text-transform: uppercase;
}

/* links */

div#content a {
  color: #e36b25;
  text-decoration: none;
}

div#content a:hover {
  color: #999;
  text-decoration: none;
}

a:focus {
  outline: none;
}

div#content div.sidebar-box a {
  font-family: "courier new", verdana, sans-serif;
}

div#content div.sidebar-box.gray a {
  color: #fff;
  text-decoration: underline;
}

div#content div.sidebar-box.yellow a {
  color: #000;
  text-decoration: underline;
}

div#footer {

	font: 70%/150% Georgia, "Times New Roman", Times, serif;
}

div#footer a { color: #fff;
text-decoration:none;
}

div#footer a:hover { color: #ddd;
}


a#setup { cursor: pointer; }

div#content h2.header a { color: #222; }
div#content h2.header a:hover { text-decoration: none; }

/* forms */

input.text, select, textarea {
  font: 90% "courier new", verdana, sans-serif;
  padding: 5px 10px;
  color: #000;
  border: 1px solid #e5e5e5;
  background-color: #e5e5e5;
}

#malgrupp {
  font: 11px "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", "Lucida", sans-serif;
  padding: 5px 10px;
  color: #000;
  border: 1px solid #e5e5e5;
  background-color: #e5e5e5;
  width:250px;
}

input.button {
  font: italic 90% "courier new", verdana, sans-serif;
  text-transform: uppercase;
  padding: 4px 10px;
  color: #fff;
  border: none;
  background-color: #444;
}

input.button:hover {
  border-color: #c1c3c2;
  background-color: #c1c3c2;
}

div#settings input.button {
  color: #000;
  border-color: #e5e5e5;
  background-color: #e5e5e5;
}

input#query {
  width: 195px;
}

div#settings label {
  display: block;
  line-height: 1.5;
}

div#settings p.form-item {
  float: left;
  width: 170px;
}

/* contact form */

div.contact-form {
  background-color: #f5f5f5;
  padding: 20px;
}

div.contact-form label {
  display: block;
}

div.contact-form input.text,
div.contact-form select,
div.contact-form textarea {
  font: 90% "courier new", verdana, sans-serif;
  padding: 5px 5px;
  color: #000;
  border: 1px solid #fff;
  background-color: #fff;
}

div#ContactForm_errSummary,
div#TellAFriendForm_errSummary {
  border: 1px solid #f66565;
  background-color: #ffe0e0;
  padding: 10px;
}

div#ContactForm_errSummary,
div#TellAFriendForm_errSummary { margin-top: 20px; }

div#main div#ContactForm_errSummary ul,
div#main div#ContactForm_errSummary ul li,
div#main div#TellAFriendForm_errSummary ul,
div#main div#TellAFriendForm_errSummary ul li { margin: 0; padding: 0; list-style: none; }

/* images */

div.sidebar-picture-box img { margin: 0 0 12px 0; }

/* misc */


table tr td { font-size:0.8em; }

.clear { clear: both; }

.hr { clear: both; margin: 30px 0; height: 1px; background-color: #a49f99; }


.bookmark,
div#main .bookmark,
div#full .bookmark{
	font-size:70%;
	color:#555;
	border:1px solid #e1e1e1;
	background:#f9f9f9;
	padding:5px 10px;
	font-family:Georgia, "Times New Roman", Times, serif;
	margin-bottom: 30px;
}

.bookmark a,
div#main .bookmark a,
div#full .bookmark a{
	color:#555;
}

.bookmark a:hover,
div#main .bookmark a:hover,
div#full .bookmark a:hover{
	color:#555;
	text-decoration:underline;
}

div#main .bookmark ul,
div#full .bookmark ul { font-size: 100%; list-style: none; margin: 0; padding: 0; }
div#main .bookmark li,
div#full .bookmark li { list-style: none; display: inline; margin: 0; padding: 0; }

div#main .bookmark li a,
div#full .bookmark li a { padding: 0 15px 0 22px; }

.delicious a { background: url(/gfx/delicious.png) no-repeat center left; }
.digg a { background: url(/gfx/digg.png) no-repeat center left; }
.facebook a { background: url(/gfx/facebook.png) no-repeat center left; }
.myspace a { background: url(/gfx/myspace.png) no-repeat center left; }
.pusha a { background: url(/gfx/pusha.png) no-repeat center left; }
.tellafriend a { background: url(/gfx/tellafriend.png) no-repeat center left; }

blockquote.quote {
	padding:12px 0;
	margin: 5px 20px 8px 0;
	float:left;
	width:220px;
	text-align: center;
	border-top:3px double #ccc;
	border-bottom:3px double #ccc;
        border-left:0;
        border-right:0;
        background:#fefefe;
}

blockquote.quote.right {
	margin: 5px 0 8px 20px;
	float:right;
}

blockquote.quote p {
	margin:0 !important;
	color:#999;
  font: 20px/30px georgia, "times new roman", serif !important;;
}

div#main ul.slideshow {
  margin: 0;
  padding: 0;
}

div#main ul.slideshow li {
  list-style: none;
  margin: 0;
  padding: 0;
}