@charset "utf-8";
/* CSS Document */

body {
	margin: auto;
	font-family: Helvetica, Arial, sans serif;
	background: #efefef;
}

#wrap {
min-height: 100%;
height: auto !important;
margin: 0 auto -150px;
}

#logowrap {background-color: #225CB0; width:100%; padding-top: 10px;}
#logowrap img{max-width:100%; height:auto;}
	#logo {width:870px; margin: 0 auto; text-align:center;}
	#logo a{text-decoration:none;}
	.site-title {font-size:60px; font-weight:bold; font-family: Arial, serif; color:#fff; line-height:1; background: url(imgs/kalkylator-logo.png) top 10px left 5px no-repeat; background-size: 37px auto; padding-left: 50px;}

#main {
	height: auto;
	width: 600px;
	margin: auto;
}

/* the menu */

#header {background-color:#225CB0; display:block; width:100%; height:45px; padding-top:0px;}
#header-menu {margin:auto; width:850px;}
#header-menu ul {list-style: none; padding: 0; margin: 0; background: white; float: left; width: 100%;}
#header-menu li {float: left; margin: 0 1em 0 0;}
#header-menu a {text-decoration: none; display: block; width: 6em; padding: 0 0.5em; font-weight: bold; border-bottom: 0.5em solid #efefef; color: white;}
#header-menu a:hover {border-bottom: 0.5em solid grey; color: grey;}
#header-menu a:active {border-bottom: 0.5em solid grey; color: grey;}

/* the content */

#sidlayout {
	float: left;
	min-height:550px;
	width: 85%;
	padding: 30px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	margin-top: 0;
	z-index: 1;
}

h1 {
	font-size: 1.6em;
}

h2 {
	font-size: 1.4em;
}

table{
	border-collapse:collapse;
	border-spacing:0;
	width:100%;
	font-size: 13px
}

tr:nth-of-type(odd) {
  background-color:#ccc;
}
th {
	background-color:#000;
	color:#fff;
	padding:2px;
}
td {
	padding:2px;
	text-align:center;
}

.resultat {
	background: rgb(2, 138, 13);
	color: rgb(255, 255, 255);
	padding: 15px;
	font-size: 1.1em;
	box-shadow: 0 0 5px 0 #555555;
	border-radius: 5px;
}

input[type="submit"] {
	height: 40px;
	min-width: 155px;
	font-size:18px;
}
input[type="text"], input[type="number"] {
	font-size:1.3em;
	width:150px;
	text-align: right;
}
select {
	height: 25px;
	min-width: 150px;
	font-size: 1em;
}

.adsense {
	float:right;
	margin-top:10px;
	margin-bottom:10px;
}

.formCalc {
	display:block;
	background-color: #225CB0;
	color: white;
	padding: 10px;
	border-radius: 25px;
	border:10px solid white;
}

#message_ajax, #message_ajax_2 {
	display:block;
	clear:both;
	margin-top: 12px;
	width: 100%;
}

.offers ul li {margin-top:15px;}

/* footer */
#footer {
	background-color: #101010;
	display: block;
	width: 100%;
	height: 150px;
	color: #FFFFFF;
	padding: 20px 0;
	margin-top: -150px;
	clear: both;
}

#footer-content {
	width:600px;
	display:block;
	margin:auto;
}

#footer h3 {
	font-size:12px;
}

#footer p{
font-size:11px;
}

#footer a:link, #footer a:visited {color:#fff !important; text-decoration:underline !important;}

/* övrigt */

#iconselect li{
	display:inline-block;
	width:175px;
	text-align: center;
}
#iconselect img{
	margin-bottom:10px;
}

#iconselect img:hover{
	box-shadow: 0 0 5px 0 #555555;
}

.homelink {float:left;}

/* Responsive menu */
/* Clearfix */
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}
nav {
	height: 40px;
	width: 100%;
	font-weight: bold;
	position: relative;
	color:#000;
}
nav ul {
	padding: 0;
	margin: 0 auto;
	width: 800px;
	height: 40px;
}
nav li {
	display: inline;
	float: left;
	margin: 0 5px 0 0;
}
nav a {
	color: #fff;
	display: inline-block;
	width: 120px;
	text-align: center;
	text-decoration: none;
	line-height: 40px;
	font-weight: bold;
	border-bottom: 0.5em solid white;
	font-size:13px;
}
nav li a {
}
nav li:last-child a {
	border-right: 0;
}
/* a:visited, a:link {color:black !important; text-decoration:none !important;} */
nav a:hover {border-bottom: 0.5em solid #F36;}
nav a:active {border-bottom: 0.5em solid #F36;}

nav a#pull {
	display: none;
}

/*Styles for screen 600px and lower*/
@media screen and (max-width: 600px) {
 .site-title {font-size:33px; background-size: 28px auto; padding-left: 40px; background-position:7px 0; margin-bottom:10px;}
 #main {width:95%;}
 #footer {height:auto;}
 #footer-content {width:90%; background-color:#101010; padding:0 10px;}
 #logo {width:100%;}
 #header {padding-top:10px;}
 .footbanner {max-width:300px;}
 #sidlayout {padding:0; width:95%;}
 #sidlayout img {max-width:100%;}
 #iconselect li {margin-bottom: 25px; width:90%;}
  nav a:hover {border:none; color:#fff;}
	
	nav { 
  		height: auto;
		border-bottom: 0;
		background-color: #000;
		color:#fff;
		margin-top:0px;
		z-index:1;
  	}
  	nav ul {
  		width: 100%;
  		display: none;
  		height: auto;
  	}
  	nav li {
  		width: 100%;
  		float: left;
  		position: relative;
		border-bottom: 1px dashed white;
  	}
  	nav li a {
		border:none;
		color:#fff;
	}
  	nav a {
	  	text-align: left;
	  	width: 100%;
	  	text-indent: 25px;
  	}
	nav a#pull {
		display: block;
		background-color: #000;
		color:#fff !important;
		width: 100%;
		position: relative;
		border-bottom: .5em solid #F36;
	}
	nav a#pull:after {
		content:"";
		background: url('/imgs/nav-icon.png') no-repeat;
		width: 30px;
		height: 30px;
		display: inline-block;
		position: absolute;
		right: 15px;
		top: 10px;
	}
}

/*Styles for screen 515px and lower*/
@media only screen and (max-width : 480px) {
}

/*Smartphone*/
@media only screen and (max-width : 320px) {
	nav li {
		display: block;
		float: none;
		width: 100%;
	}
	nav li a {
		border-bottom: 1px solid #576979;
	}
}