﻿
/* --------------------------------------------------- 
/* BASIC --------------------------------------------- */
/* --------------------------------------------------- */
*
{
	padding: 0;
	margin: 0;
}
html
{
	font-size: 62.5%;
	height: 100%;
	margin: 0;
	padding: 0;
	overflow: -moz-scrollbars-vertical;
}
/*:root { overflow-y: scroll; }*/
body
{
	margin: 0;
	padding: 0;
	height: 100%; /* needed for container min-height */
	font-family: Verdana, Arial;
	font-size: 1em;
	color: #636262;
	background-color: #fff;
	background-image: url(../../Assets/Images/bg-main.gif);
	background-repeat: repeat-x;
}
form
{
	height: 100%;
	margin: 0;
	padding: 0;
}
a
{
	color: #326ea2;
	text-decoration: none;
}
a:hover
{
	text-decoration: underline;
}
img
{
	border: none;
}
input, textarea, select
{
	font-family: Verdana, Arial;
	font-size: 1em;
	padding: 1px;
}
input.input
{
	border: 1px solid #aaa;
	padding: 3px;
}
.clear
{
	clear: both;
	float: none;
}
.float-left
{
	float: left;
}
.photo-frame
{
	border: 1px solid #ddd;
	padding: 1px;
}
input.redborder
{
	background-color: #ff7;
	border: 1px solid red;
}
table.form 
{
	width: 300px;
	border-collapse: collapse;
	font-size: 1.1em;
}
table.inputtext input, table.form select
{
	width: 200px;
}
table.form .button input
{
	width: 100px;
}
table.form .button
{
	text-align: right;
}
table.form td
{
	padding: 5px;
}
table.form td.label
{
	text-align: right;
}
span.red
{
	color: Red;
}
/* --------------------------------------------------- 
/* TEXT CHUNKS ----------------------------------------- */
/* --------------------------------------------------- */
h1
{
	font-size: 3.6em;
	font-weight: bold;
	font-family: Arial;
	line-height: 1em;
	color: #000;
	margin-bottom: 5px;
}
h2
{
	font-size: 1.9em;
	font-family: Arial;
	margin-top: 10px;
	color: #333;
}
h3
{
	font-size: 1.4em;
	font-family: Arial;
	font-weight: bold;
	color: #444;
	margin: 10px 0;
}
h4
{
	font-size: 1.2em;
	font-family: Arial;
	font-weight: bold;
	margin-top: 0;
	color: #333;
}
.green
{
	font-size: 1em;
	font-family: Arial;
	font-weight: bold;
	margin: 0;
	color: green;
}

p
{
	font-size: 1.1em;
	line-height: 1.4em;
	margin-bottom: 1.1em;
}
p.introduction
{
	font-size: 1.3em;
	margin-bottom: 20px;
	color: #444;
}
p.comment
{
	font-size: 1em;
	margin-bottom: 20px;
	padding-right: 30px;
}

/* --------------------------------------------------- 
/* HEADER --------------------------------------------- */
/* --------------------------------------------------- */

#header
{
	height: 77px;
	color: #a4a4a4;
	position: relative;
	margin-bottom: 30px;
}
#header a
{
	color: #fff;
}

#header .logo
{
	position: absolute;
	top: 11px;
}

#header #linkbar
{
	position: absolute;
	right: 5px;
	top: 7px;
	line-height: 21px;
}
#header #linkbar select
{
	font-size: .9em;
	font-family: Verdana, Arial;
}
#header a.flag
{
	display: block;
	float: left;
	width: 33px;
	height: 21px;
	margin: 1px 0 0 0;
}
#header a.english
{
	background-image: url(../../Assets/Images/flag-uk-slide.gif);
}
#header a.swedish
{
	background-image: url(../../Assets/Images/flag-se-slide.gif);
}
#header a.selected
{
	background-position: -33px 0;
}

/* --------------------------------------------------- 
/* TOP MENU --------------------------------------------- */
/* --------------------------------------------------- */

#top-menu
{
}

#top-menu #left-tabs
{
	color: #333232;
	font-size: 1.1em;
	position: absolute;
	bottom: 0;
	_bottom: -1px; /* IE6Win Only Hack (Bör fixas till lägre nivå CSS) */
}

#top-menu #left-tabs div.tab, #top-menu #right-tabs div.tab
{
	float: left;
	margin: 0 1px;
}

#top-menu #left-tabs a, #top-menu #right-tabs a
{
	display: block;
	line-height: 28px;
	float: left;
	color: #fff;
	background-image: url(../../Assets/Images/topmenu-tab-tile.gif);
	background-repeat: repeat-x;
	padding: 0 10px;
}

#top-menu #left-tabs img, #top-menu #right-tabs img
{
	float: left;
}

#top-menu #left-tabs div.selected a, #top-menu #right-tabs div.selected a
{
	color: #000;
	background-image: url(../../Assets/Images/topmenu-tab-tile-selected.gif);
}

#top-menu #right-tabs
{
	position: absolute;
	bottom: 0;
	_bottom: -1px; /* IE6Win Only Hack (Bör fixas till lägre nivå CSS)*/
	right: 0;
	font-size: 1.1em;
}

#top-menu .left-tab-image, #top-menu .right-tab-image
{
	height: 28px;
	width: 5px;
	float: left;
}

#top-menu .left-tab-image
{
	background-image: url(../../Assets/Images/topmenu-tab-left.gif);
}

#top-menu .right-tab-image
{
	background-image: url(../../Assets/Images/topmenu-tab-right.gif);
}

#top-menu .selected .left-tab-image
{
	background-image: url(../../Assets/Images/topmenu-tab-left-selected.gif);
}

#top-menu .selected .right-tab-image
{
	background-image: url(../../Assets/Images/topmenu-tab-right-selected.gif);
}

/* --------------------------------------------------- 
/* SUB MENU --------------------------------------------- */
/* --------------------------------------------------- */

#sub-menu
{
	height: 32px;
	position: relative;
	_bottom: -1px; /* IE6 Only */
	z-index: 5;
}

#sub-menu #tabs
{
	float: right;
	color: #333232;
	font-size: 1.2em;
	width: 400px;
	margin-bottom: -1px;
}

#sub-menu #tabs a
{
	display: block;
	float: left;
	line-height: 34px;
	height: 33px;
	color: #636262;
	padding: 0 20px;
}

#sub-menu #tabs img
{
	float: left;
}

#sub-menu #tabs div.selected a
{
	display: block;
	height: 33px;
	color: #636262;
	background-image: url(../../Assets/Images/submenu-tab-tile.gif);
	background-repeat: repeat-x;
	padding: 0 20px;
	color: #000;
}

#sub-menu #tabs div.selected div.left-tab-image
{
	height: 33px;
	width: 6px;
	background-image: url(../../Assets/Images/submenu-tab-left.gif);
	float: left;
}

#sub-menu #tabs div.selected div.right-tab-image
{
	height: 33px;
	width: 6px;
	background-image: url(../../Assets/Images/submenu-tab-right.gif);
	float: left;
}

/* --------------------------------------------------- 
/* MAIN --------------------------------------------- */
/* --------------------------------------------------- */

#main
{
	text-align: left;
	position: relative;
	margin: 0 auto;
	width: 860px;
}


/* --------------------------------------------------- 
/* CONTENT --------------------------------------------- */
/* --------------------------------------------------- */

#content
{
	background-image: url(../../Assets/Images/content-bg-top.gif);
	background-repeat: no-repeat;
	padding: 20px 0 0 30px;
	
}

.content-footer
{
	margin-top: -30px;
}

#content-information
{
	float: left;
	width: 500px;
	padding: 1px 0 0 0; /* Fixes IE6 Shop-off r text */
	display: inline; /* Fixes IE6 Double Margin BUG */
}

/* --------------------------------------------------- 
/* FEATURES MENU --------------------------------------------- */
/* --------------------------------------------------- */

#features-menu
{
	height: 241px;
	width: 206px;
	line-height: 39px;
	font-size: 1.2em;
	float: left;
	margin: 0 30px 0 0;
}
#features-menu a
{
	display: block;
	border-right: 1px solid #dcdcdc;
	border-bottom: 1px solid #dcdcdc;
	border-left: 1px solid #dcdcdc;
	height: 39px;
	color: #111;
	background-position: 9px 11px;
	background-repeat: no-repeat;
	padding-left: 35px;
	background-color: #f9f9f9;
}
#features-menu a.message-creation
{
	border-top: 1px solid #dcdcdc;
}
#features-menu a.segmentation
{
	background-image: url(../../Assets/Images/icon-segmentation.gif);
}
#features-menu a.personalization
{
	background-image: url(../../Assets/Images/icon-personalization.gif);
}
#features-menu a.statistics
{
	background-image: url(../../Assets/Images/icon-statistics.gif);
}
#features-menu a:hover
{
	background-color: #f9f9f9;
}
#features-menu a.selected
{
	background-color: #eee;
}

/* --------------------------------------------------- 
/* FOOTER --------------------------------------------- */
/* --------------------------------------------------- */

#footer
{
	margin: 15px 0;
	position: relative;
	line-height: 1.4em;
	height: 150px;
}
#footer p
{
	margin: 10px 5px 10px 0;
	font-size: 1em;
}
#footer h4
{
	margin-bottom: 12px;
}
#footer-tile
{
	height: 110px;
	background-image: url(../../Assets/Images/footer-tile.gif);
}
#footer #footer-tile div.column /* All columns */
{
	position: absolute;
	top: 20px;
	width: 250px;
}
#footer #left-column
{
	left: 25px;
}
#footer input.phonenumber
{
	width: 160px;
}
#footer #middle-column
{
	left: 319px;
}
#footer #middle-column li
{
	margin: 0 0 4px 0;
	list-style-image: none;
	list-style-type: none;
}
#footer #middle-column ul
{
	padding: 0;
	margin: 0;
}
#footer #right-column
{
	left: 600px;
}
#footer input.email
{
	width: 170px;
}
#footer p
{
	margin-top: 0;
}

/* --------------------------------------------------- 
/* OVERVIEW / TECHNOLOGY TEMPLATE------------------------------ */
/* --------------------------------------------------- */

.overview-page .first-column, .technology-page .first-column
{
	width: 519px;
	float: left;
	margin-right: 30px;
}
.overview-page .button-column, .technology-page .button-column
{
	width: 260px;
	float: left;
}
.overview-page .button-column p, .technology-page .button-column p
{
	margin: 0; /* IE6 Fix */
	padding-left: 7px;
}
.overview-page .separator, .technology-page .separator
{
	background-color: #eee;
	height: 5px;
	margin: 5px 30px 15px 0;
}
.overview-page .left-column, .technology-page .left-column
{
	width: 246px;
	float: left;
	margin-right: 30px;
}
.overview-page .middle-column, .technology-page .middle-column
{
	width: 246px;
	float: left;
	margin-right: 30px;
}
.overview-page .right-column, .technology-page .right-column
{
	width: 246px;
	float: left;
}
.overview-page .overview-button, .technology-page .overview-button
{
	width: 230px;
	line-height: 30px;
	float: left;
	background-image: url(../../Assets/Images/btn-overview.gif);
	background-repeat: no-repeat;
	color: #333;
	font-size: 1.3em;
	padding-left: 15px;
	margin: 0 0 5px 0;
	font-weight: normal;
}
.email-technology-image
{
	background-image: url(../../Assets/Images/btn-overview.gif);
}

.overview-page .four-column p
{
    width:170px;
    float:left;
    margin-right:30px;   
}
.two-column-right
{
    width:500px;
    float:left;
    margin-right:30px; 
}
.overview-page .welcome-photo
{
    width:789px;
    background-repeat: no-repeat;
    background-position: bottom right;
    border-bottom: 1px solid #ccc;
    margin-bottom: 20px;
}
.overview-page .welcome-photo p
{
    padding-left: 2px;
}
.overview-page .welcome-photo h1
{
    font-size: 3.1em;
}
.overview-page .welcome-photo .introduction
{
    width: 350px;
    margin: 20px 0;
}
.overview-page .email-photo
{
	background-image: url(../../Assets/Images/photo-email.gif);
}
.overview-page .sms-photo
{
	background-image: url(../../Assets/Images/photo-sms.gif);
}
.overview-page .psms-photo
{
	background-image: url(../../Assets/Images/photo-psms.gif);
}
/* --------------------------------------------------- 
/* FEATURES TEMPLATE--------------------------------- */
/* --------------------------------------------------- */

.features-page #first-page
{
	float: left;
	width: 590px;
}
.features-page .column
{

	width: 163px;
	float: left;
	margin-right: 30px;
	margin-bottom: 25px;
}
.features-page .column a
{
	color: #0165b2;
	text-decoration: underline;
}
.features-page #sub-page
{

	margin-right: 30px;
	float: left;
	width: 550px;
}
.features-page #sub-page div.left-column
{
	margin-right: 30px;
	float: left;
	width: 258px;
}
.features-page #sub-page div.right-column
{
	float: left;
	width: 258px;
}
.features-page #sub-page div.full-column
{
	clear: both;
}
.features-page h2
{
	margin-bottom: 10px;
}
.features-page ul
{
	margin-left: 30px;
}
.features-page li
{
	margin-bottom: 7px;
	margin-left: 10px;
	list-style-type: circle;
}
/* --------------------------------------------------- 
/* FIRST PAGE ------------------------------------ */
/* --------------------------------------------------- */
.firstpage_img
{
	text-align: left;
	position: relative;
	margin: 0 auto;
	width: 780px;
}
.first-page-column
{
	background-image: url(../../Assets/Images/bg-firstpage-column.gif);
	background-repeat: no-repeat;
	height: 180px;
}
.first-page-column h2
{
	padding: 20px 0 0 25px;
}
.first-page-column p
{
	padding: 10px 20px 0 25px;
	height: 50px;
}
.firstpage
{
	padding: 20px;
}
.first-page .left-column
{
	width: 246px;
	float: left;
	margin-right: 21px;
}
.first-page .middle-column
{
	width: 246px;
	float: left;
	margin-right: 21px;
}
.first-page .right-column
{
	width: 246px;
	float: left;
}
/* --------------------------------------------------- 
/* CUSTOMER REQUEST PAGE ------------------------------------ */
/* --------------------------------------------------- */

.customer-request-page .button
{
	padding: 3px; 
	font-size: 1.2em;
    float: right;
    margin-right: 200px;
}