/*

    CSS Document



    Site: IML technologies
   
    URL: http://www.iml.se
   
    Author: PS Kommunikation
   
    Version: 2.1
   
    Date: 2011.03.20

*/

@import url(typo.css);


/* General
-----------------------------------------------------------------------------*/


body {
    margin:0;
    padding:0;
    background: url(../images/bg_body.png) repeat-x top left;
    text-align:center;
} 
div#wrapper {
    margin-left: auto;
    margin-right: auto;
    width: 900px;
    text-align: left;
}

/* Common layout
-----------------------------------------------------------------------------*/

/* top */

div#top {
    background:url(../images/bg_top.png)  no-repeat top left;
    position:relative;
    height:427px;
    width:900px;
}
div#logo {
    position:absolute;
    top:25px;
    left:20px;
}
div#usp_text {
    position:absolute;
    top:230px;
    left:22px;
    width:380px;
}
div#usp_text H1 
{
    font-size:1.8em;

}
div#usp_text P {
    color:#353436;
    font-size:1.2em;
    line-height:1.8em;
}
div#usp_text A {
    color:#353436;
}
div#usp_media {
    height:394px;
    position:absolute;
    top:0;
    right:0;
    width:400px;
}
body#subpage div#usp_media {
    background:url(../images/bg_usp.png) no-repeat center bottom;   
    height:369px;
    position:absolute;
    top:0;
    right:0;
    text-align:center;
    width:475px;     
}
body#subpage div#usp_media IMG {
    margin:25px 0 0 0;
}
body#subpage div#usp_media div#video {
    margin:25px 0 0 0;
}

/* middle */

div#middle {
    margin:60px 0 30px 0;
    width: 900px;
}

/* sidebar */

div#sidebar {
    width:250px;
    display:inline;
    float:left;
    margin:1px 50px 0 40px;
    padding:0;
    background: url(../images/bg_sidebar.jpg) no-repeat;
}
div#sidebar h2 {
    margin-top:0;
    padding-top:0;
}
div#sidebar div#projects_spots P {
    padding-top:5px;
}
.spot {
    background: url(../images/bg_puff.png) no-repeat;
    height:115px;
    margin:0px 0 0 0;
    padding:20px;
    width:210px;
}
.spot H2 {
    font-size:1.4em;

}
.spot P A {
    color:#fff;
}
.spot P A {
    font-weight:bold;
}
div#video { margin:6px 0 0 50px }

div#navcontainer { margin:0; padding:0; text-align:left; }

/* content */

div#content {
    margin:0 40px 0 0;
    padding:0 0 0 0;
    width:500px;
    display:inline;
    float:right;
} 


/* Navigation

-----------------------------------------------------------------------------*/

/* helpNav */

ul#help_nav  {
	list-style:none;
    height:35px;
    display:block;
    position:absolute;
    top:5px;
    right:15px;
    margin:0;
    width:200px;   
    z-index:9999; 
}
ul#help_nav li {
	font-size:1.1em;
	color:#ccc; 
	float:right;
	margin-right:30px;
}
ul#help_nav li a {
    font-weight:bold;
    color:#fff;
}
ul#help_nav a, ul#help_nav li a:hover { color:#87888A; }

ul#help_nav a, ul#help_nav li a:hover { color:#87888A; }

/* topNav */

div#navcontainer {
    bottom:0;
    position:absolute;
    height:34px;
    left:0;
}
#navcontainer ul  {
    list-style-type: none;
    height:34px;
    margin:0 0 0 10px;
    padding:0;
}
#navcontainer ul  li {
    display: inline;
    float: left;
    font-size:14px;
    font-weight:bold;
    line-height:30px;
    text-align: center;
    margin:4px 20px 0 0;
    padding: 0 4px 0 10px;
}
#navcontainer ul  li a {
    display:block;
    color:#fff;
    text-decoration:none;
}
#navcontainer ul li.current {
    background: url(../images/bg_mainnav_right.png) no-repeat top right; 
    padding:0 30px 0 0;
}
#navcontainer ul  li a.active {
    background: url(../images/bg_mainnav_left.png) no-repeat top left;
    color:#fff; 
    padding:0 0 0 30px;
}

/* subNav */

div#sidebar h1 {
    font-size:1.8em;
    line-height:2.1em;
    padding:0;
    margin:0;
}
div#sidebar p {
    font-size:1.1em;
    line-height:1.5em;
    padding:0;
    margin:0 0 20px 0;
}
div#sidebar ul {
    font-size:1.1em;
    list-style-type: none;
    padding:0;
    margin:0;
}
div#sidebar ul li {
    margin:0;
    padding:0.5em 0 0.5em 0;
    line-height:normal;
}
div#sidebar ul li.active a {
    color:#87888A;
}
div#sidebar ul li a:hover {
    color:#87888A;
}


/* Layout Start
-----------------------------------------------------------------------------*/

div#box_about {
    background:#0c7bb7 url(../images/bg_box_about.jpg) no-repeat;
    height:105px;
    margin:38px 0 0 0;
    padding:20px;
    width:460px;
}
div#box_about h3 {
    padding:0;
    color:#fff;
    line-height:1.5em;
}
div#box_about .button {
    color:#109fed;
    font-size:11px;
    font-weight:bold;
    margin-left:385px;
}
div#box_newsletter {
    margin:0;
    background:#d8d9da url(../images/bg_box_newsletter.jpg) no-repeat;
    border-top:solid 1px #fff;
    height:85px;
    width:500px;}

div#box_newsletter h3 {
    margin:30px 5px 0 150px;
    padding:0;
}
div#box_newsletter h3 strong { color:#109fed; }
div#box_newsletter a { color:#353436; }

/* Layout underpages
-----------------------------------------------------------------------------*/

/* Technology */

.placeholder_object_items {
    margin:0 0 35px 0;
}
.object_item_text {
    float:left;
    margin:0;
    width:270px;

}
.object_item_text P {
    font-size:11px;
    line-height:16px;
    margin:0;
}
.object_item_img {
    float:right;
    margin:0px 0 0 20px;
    width:210px;
}

/* Customers */

div#customerContainer {
    margin:0;
}
.customers {
    float:left;
    margin:0 10px 30px 0;
    width:155px;
    text-align:center;    
}
.customers img {
    border:none;
    width:150px;
    border:1px solid #222;
}
.customers p {
    color:#fff;
    font-size:11px;
    margin:3px 0;
    padding:0;
}


/* Google maps
-----------------------------------------------------------------------------*/

div#GoogleMap {
    margin-bottom:10px;
}
div#GoogleMapDescription {
    margin:0;
    background:#e6e7e9;
    border-bottom:solid 1px #d9dadc;
    border-left:solid 1px #d9dadc;
    border-right:solid 1px #d9dadc;
    padding-top:15px;
}

/* Footer
-----------------------------------------------------------------------------*/

div#footer  {
    background:#29282a; 
    border-top:2px solid #0d80bf;
    width:890px;
    margin:0 0 0 0;
    position:relative;
    padding:5px 5px 10px 5px;
}
div#footer P  {
    font-size:10px;
    color:#f1f1ee;
    line-height:normal;
    margin:0 0 5px 0;
    padding:10px;
    width:70%	
}
div#footer A  {
    color:#f1f1ee;
}
div#footer IMG {
    position:absolute;
    right:5px;
    top:5px;
}


/* Production
-----------------------------------------------------------------------------*/

div#production  {
    margin:5px 0 0 0;
    padding:0 5px 10px 5px;
}
div#production P  {
    font-size:10px;
    color:#666;
    line-height:normal;
    margin:0 0 5px 0;
    text-align:right;
}
div#production A  {
    color:#666;
}



/* Classes
-----------------------------------------------------------------------------*/

.hide {
    position: absolute;
	left: -9999px;
	z-index: 100;
}
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block; clear:both;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.hidden {
    display:none;
    visibility:hidden;
}
.visible {
    display:block;
    visibility:visible;
}
.float_right {
    float:right;
    margin:5px 0 10px 20px;    
}
.float_left {
    float:left;
    margin:5px 20px 10px 0;
}

