/* Linked fonts */
@font-face{
	font-family: "Vera";
	src: url("../fonts/Vera.ttf") format("truetype");
}

@font-face{
	font-family: "Vera";
	src: url("../fonts/VeraB.ttf") format("truetype");
	font-weight: bold;
}

html{
	height: 100%;
}

body{
	font-family: Vera, "Lucida Grande", Helvetica, Arial, sans-serif;
	font-size: 11px;
	height: 100%;
	color: #212121;
}

h1{
	font-size: 16px;
	color: #212121;
	margin-bottom: 5px;
}

h3{
	color: #212121;
	margin-bottom: 5px;
	font-size: 12px;
	line-height: 18px;
}

a{
	color: #0a72e6;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
}

a:hover{
	text-decoration: underline;
}

p{
	margin-bottom: 5px;
	line-height: 17px;
	
	
}

#system-wrap {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	position: relative;
	margin: 0 auto -73px;
}


#system-top{
	height: 180px;
	background: url(../images/backgrounds/bg_system_top.png) repeat-x;
}

#system-top-content{
	margin: auto;
	width: 960px;
	overflow: hidden;
	color: #fff;
}

#system-top-logo{
	float: left;
	margin-top: 5px;
}

#system-top-menu-wrap{
	position: relative;
}

#system-top-menu{
	font-size: 10px;
	height: 27px;
	line-height: 27px;
	border-left: 1px solid #1A1A1A;
	border-bottom: 1px solid #1A1A1A;
	border-right: 1px solid #1A1A1A;
	background: url(../images/backgrounds/bg_system_top_menu.png) repeat-x;
	position: absolute;
	top: 0px;
	right: 10px; 
}

#system-top-menu-logged-out-wrap{
	width: 221px;
	float: right;
}

#system-top-menu-logged-out{
	font-size: 10px;
	height: 135px;
	width: 199px;
	/*line-height: 27px;*/
	padding-right: 10px;
	float: right;
	padding: 10px;
	margin-right: 10px;
	border-left: 1px solid #1A1A1A;
	border-bottom: 1px solid #1A1A1A;
	border-right: 1px solid #1A1A1A;
	background: url(../images/backgrounds/bg_system_top_menu_logged_out.png) repeat-x; 
	overflow: hidden;
}

#system-top-menu-logged-out-shadow {
	background: url(../images/backgrounds/bg_system_top_menu_logged_out_shadow.png) no-repeat; 
	width: 221px;
	height: 10px;
	float: right;
	margin-right: 10px;
}

#system-top-menu-logged-out img{
	float: left;
}

#rememberme {
	margin: 6px 0 0 0;

}

#rememberme-label{
	display: inline;
	
	color: #fff;
	font-size: 10px;
	
}


#login-label {
	line-height: 14px;
}

#login-label span{
	margin-left: 8px;
	font-weight: bold;
}

#register-label {
	margin-top: 14px;
	background: url(../images/buttons/bt_register_login_large.png) no-repeat;
	width: 232px;
	height: 50px;
	display: block;
	float: right;
	margin-right: 90px;
}

#register-label:hover {
	background-position: 0 -50px; 
}

#forgotten-password {
	color: #FFFFFF;
	float: left;
	font-size: 10px;
	margin-left: 3px;
	width: 100px;
	height: 12px;
	margin-top: 15px;
}

#not-registered {
	color: #FFFFFF;
	float: left;
	font-size: 10px;
	margin-left: 3px;
	margin-top: 3px;
	margin-bottom: 3px;
	width: 190px;
	display:block;
	height: 16px;
}

#system-top-menu a.top-menu-item{
	color: #fff;
	display: block;
	float: left;
	height: 27px;
	padding: 0 5px 0 20px;
	margin-left: 5px;
	text-decoration: none;
}

#system-top-menu a.top-menu-item:hover{
	text-decoration: underline;
}

#system-top-menu a.top-menu-item:visited{
	color: #fff;
}

#top-menu-inbox{
	background: url(../images/icons/ic_email_open.png) no-repeat center left;
}

#top-menu-settings{
	background: url(../images/icons/ic_application_form_edit.png) no-repeat center left;
}

#top-menu-help{
	background: url(../images/icons/ic_help.png) no-repeat center left;
}
/*nytt ers?tter #top-menu-logout*/
#system-top-menu a#top-menu-logout.top-menu-item{
	margin-left: 20px;
	background: url(../images/icons/ic_logout.png) no-repeat center left;
}
/*nytt*/
#system-top-menu a#top-menu-user.top-menu-item{
	padding: 0px;
	margin-right: 20px;
}


#system-menu{
	height: 32px;
	margin-top: 91px;
	overflow: hidden;
}

#system-content{
	margin: auto;
	width: 960px;
	overflow: hidden;
	padding-bottom: 30px;
}


#push {
	height: 73px;
}

/* The submenu */
.system-sub-menu{
	margin: 10px 10px 20px 10px;
	overflow: hidden;
}


/* Generic style for boxes */
.box{
	border:  1px solid #CFCFCF;
	margin: 0 9px 20px 9px;
	overflow: hidden;
	float: left;
}

.center-box{
	border:  1px solid #CFCFCF;
	margin: 0 auto 20px auto;
	overflow: hidden;
}

.box-header{
	height: 25px;
	padding: 0 10px 0 10px;
	border-bottom: 1px solid #E1E1E1;
	border-top:  1px solid #FFF;
	line-height: 25px;
	color: #404040;
	font-weight: bold;
	background: url(../images/backgrounds/bg_box_header.png) repeat-x;
}

.box-hr{
	border-bottom: 1px solid #E1E1E1;
}

.box-header h1{
	font-size: 11px;
	color: #404040;
}

.box-header img.box-icon{
	width: 16px;
	height: 16px;
	margin-top: 4px;
	margin-right: 8px;
	float: left;
	display: inline;
}

.box-header span{
	float: left;
}

.box-header img.box-icon-right{
	width: 16px;
	height: 16px;
	float: right;
	margin-top: 4px;
	display: inline;
}

.box-content{
	padding: 20px;
	overflow: hidden;
	position: relative;
}

/* Different types of boxes. 12col is maximun width */

.box-12col{
	width: 940px;
	clear: both;
}

.box-9col{
	width: 700px;
}

.box-6col{
	width: 460px;
}

.box-3col{
	width: 220px;
}

.in-lightbox{
	margin: 0;
}




/* Style for info box */

.info-box{
	border: 1px solid #6BA6D9;
}

.info-box .box-header{
	border-bottom: 0px;
	background: #B2DAFD;
}

.info-box .box-content{
	background: #E6F5FF;
	color: #212121;
	line-height: 19px;
}


/* Style for browser puff box */

.browser-puff-box{
	border: 1px solid #E2CD90;
}

.browser-puff-box .box-header{
	border-bottom: 0px;
	background: #FDF0C1;
}

.browser-puff-box .box-content{
	background: #FEF5E0;
	color: #212121;
	line-height: 19px;
}

.browser-puff-box .box-content p.browsers{
	margin-top: 20px;
	text-align: center;
}

.browser-puff-box .box-content p.browsers a img{
	margin-right: 30px;	
}

/* Style for confirm box */

.confirm-box{
	border: 1px solid #8CE987;
}

.confirm-box .box-header{
	border-bottom: 0px;
	background: #C1FFBF;
}

.confirm-box .box-content{
	background: #E2FFDE;
	color: #212121;
	line-height: 19px;
}

.box-12col.confirm-box{
	float: none;
}



/* Special style for box with table in it */

.box .table-content{
	padding: 10px;
	border-color: #000;
}

.table-content tr th{
	padding-bottom: 5px;
}


/* Different types of tables in the boxes defined above*/

.box .table-content table{
	
	padding: 0 0 10px;
}

.box-12col table{
	width: 900px;
}

.box-9col table{
	width: 678px;
}

.box-6col table{
	width: 440px;
}

table.table-6col{
	width: 400px;
}


.float-left-box{
	padding-bottom: 20px;
	float: left;
}

.float-left-box .box{
	margin-bottom: 0;
}

/* Use this to achive "columns" wrap each column with this */
.float-left-wrap{
	float: left;
}

.float-right-wrap{
	float: right;
}

/* Will give you a column that is 50% of the content width */
.column-6col{
	float: left;
	width: 480px;
}

.inline{
	display: inline;
}

.center td{
	text-align: center;
	
}

.simple-table th, td{
	padding: 5px;
}

table.zebra-table tr.odd-row{
	background: #EEE;
}



/* Footer-styles */

#footer {
	background: url(../images/backgrounds/bg_footer.png) repeat-x;
	height: 73px;
	text-align: center;
	line-height: 13px;
	color: #555;
	position: relative;
}

#footer-text {
	position: relative;
	margin: 0 auto;
	width: 650px;
}

/* Contact tab */

.slide-out-div {
	padding: 30px;
	width: 834px;
	height: 320px;
	background: #fafafa;
	border: #4d90e4 1px solid;
	float: right;
} 

#contact-info {
	width: 340px;
	margin-right: 40px;
	margin-top: -10px;
}

#contact-form {
	padding-top: 20px;
}

.contact-info-text {
	margin-top: 10px;
	line-height: 1.5em;

}

.contact-info-text-leftcol-small {
	margin-right: 30px;
	text-align: center;
}


/* This should only be a block in the lightbox */

.box-header .lightbox-close{
	display: none;
}

.link-back {
	color:#404040;
	font-size:14px;
	font-weight:bold;
	line-height:33px;
	margin:0 0 0 10px;
	overflow:hidden;
}

.link-back a {
	font-size: 14px;
}

.link-back img {
	margin-bottom: 2px;
}

/* wrap buttons of type wide with this class in block element ex. <div> */

.wide-buttons{
	width: 166px;
	margin: 0 0;
}

.wide-buttons input:active{
	background-position: -166px 0;
}

.wide-buttons input:hover{
	color: #268323;
}

.wide-buttons input{
	margin-bottom: 5px;
	width: 166px;
	height: 33px;
	padding-bottom: 3px;
	cursor: pointer;
}

.wide-buttons a:active{
	background-position: -166px 0;
}

.wide-buttons a:hover{
	color: #268323;
	text-decoration: none;
}

.wide-buttons a{
	margin-bottom: 10px;
	width: 131px;
	height: 33px;
	padding-bottom: 3px;
	cursor: pointer;
	display: block;
	line-height: 33px;
	color: #212121;
	font-weight: normal;
	padding-left: 35px;
	overflow: hidden;
}




.login-wide{
	background: url(../images/buttons/bt_login_big.png) no-repeat;
	border: none;
	margin-right: 10px;
	padding-left:12px;
}

.login-special{
	margin-right: 15px;
}

.view-edits-wide{
	background: url(../images/buttons/bt_view_edits.png) no-repeat;
	border: none;
	margin-right: 10px;
}

.view-edits-special{
	padding-right: 8px;
}


/*Wrap each new generic button with a div with id and suiting width, ex. use firebug
 * <div id="new-sales-company-button">
 * 		<a class="iframe create-company-link generic-button" href="#"><span class="left-button"></span><span class="right-button"></span>Skapa nytt s�ljarf�retag</a>
 * </div>
 * */
#new-sales-company-button {
	width: 190px;	
}

.generic-button {
	background:transparent url(../images/buttons/bt_generic.png) repeat scroll 0 0;
	color:#212121;
	display:block;
	height:33px;
	line-height:33px;
	margin-left:20px;
	margin-bottom:10px;
	padding:0 3px;
	position:relative;
	font-weight: normal;
	text-align: center;
}

.generic-button:hover, .generic-button:hover .left-button, .generic-button:hover .right-button {
	cursor:pointer;
	text-decoration: none;
}

.generic-button:active, .generic-button:active .left-button, .generic-button:active .right-button {
	background-position:center bottom;
	cursor:pointer;
	text-decoration: none;
}

.generic-button .right-button {
	background:transparent url(../images/buttons/bt_generic_right.png) repeat scroll 0 0;
	display:block;
	height:33px;
	position:absolute;
	right:-11px;
	width:11px;
	top: 0;
}

.generic-button .left-button {
	background:transparent url(../images/buttons/bt_generic_left.png) repeat scroll 0 0;
	display:block;
	height:33px;
	left:-11px;
	position:absolute;
	width:11px;
	top: 0;
}

.generic-button-icon {
	margin-top: 9px;
	margin-right: 5px;
	float: left;
}

td.td-180-wide{
	width: 180px;
}

td.warning	{
	background: url("../images/icons/ic_warning.png") no-repeat scroll center 3px transparent;
	cursor: pointer;
	width: 10px;
}

#create-media-button {
	width: 135px;
	float: right;
	margin-right:18px;
	font-size: 11px;	
}

#preview-button {
	float:right;
	margin-right:10px;
	margin-top:7px;
	width: 150px;
}

#registerInfo {
	margin: 0 0 0 535px;
	padding: 20px 0 0 0;
}

#version-nbr {
	display:block;
	font-size:8px;
	margin-left:270px;
	margin-top:-5px;
}


#error-left-col {
	float: left;
	margin-right: 60px;
}
/*Handles the error pages 404 and unknown error*/
#error-right-col {
	float: left;
	width: 550px;
}

#error-right-col h1 { 
	font-size: 20px;
}

#error-backlink {
	display: block;
	padding-top: 15px;
	font-size: 16px;
}

#error-spacer {
	margin-top: 150px;
}

#error-description-form {
	margin-top: 20px;
}

.error-button {
	margin-right: 135px;
}