/* ==============================================
Layout Style Sheet (for version 5 browsers and above)

version:  1.0
author:   Philip Lee (MCUBE.TV)
date:     11 February 2006
================================================= */

/* =LAYOUT =INIT
================================================= */
hr, del   { display: none   }
.imgright { float: right    }
.imgleft  { float: left     }
del.show  { display: inline }
#main .imgpad { padding: 0 }


/* =LAYOUT =CLEAR
================================================= */
#header,
#menu,
#menu li,
#menu ul,
#top,
#bottom,
#footer {
	margin: 0;
	padding: 0;
}

/* =CLEARFIX
================================================= */
/* Clear Fix Hacks: To ensure container div wraps around float elements
http://www.positioniseverything.net/easyclearing.html
http://www.positioniseverything.net/articles/onetruelayout/
*/
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-table;}

/* Hides from IE-mac \*/
.clearfix {display: block;}
/* End hide from IE-mac */


/* =LAYOUT =VERTICALLY ALIGNING CONTAINER DIV IN BROWSER WINDOW
=============================================================== */

/*\*/
#valign_outer, #valign_inner {
	height: 100%;
}
#valign_outer {
	margin: 0 auto;
	display: table;
}
#valign_inner {
	display: table-cell;
	vertical-align: middle;
	
	width: 770px; /* Opera needs to set the width here */
}
/**/
#valign_inner {
	/*white-space: nowrap;*/
}

/* in IEM solo shrink-wrap, no vert.center \*//*/
#valign_outer {
	text-align: center;
}
#container {
	display: inline-block;
	text-align: left;
	width: 1px;
}
/**/

/* =LAYOUT =STYLING
================================================= */
#container {	
	overflow: hidden;
	padding: 0.05em 0 0 0;
	margin: 0 auto;
	
	text-align: left;
	
	width: 45em !important;
	min-width: 770px;
	width: 770px;
		
	background: white url("../images/en/tl.gif") top left no-repeat;
	
	border: 0;
	
	position: relative;

}

/* commented backslash hack - hide from Mac IE \*/ 
/*#container {
	height:100%;
}*/

/* =CORNERS
================================================= */
#main_bl {
	background: white url("../images/en/bl.gif") 0 100% no-repeat;
	/* Background color kust always be assigned to the first corner! */
}

#main_br {
	background: transparent url("../images/en/br.gif") 100% 100% no-repeat;
	padding: 0 1em 0.5em 0;
}

#main_tr {
	background: transparent url("../images/en/tr.gif") 100% 0 no-repeat;
	position: absolute;
	top:0;
	right: 0;
	width: 48px;
	height: 50px;
	
}

#inner_tl {
	background: transparent url("../images/en/inner-tl.gif") 0 0 repeat;
	position: absolute;
	top:0;
	left: 0;
	width: 200px;
	height: 70px;
}

#inner_tr {
	background: transparent url("../images/en/inner-tr.gif") 100% 0 no-repeat;
	position: absolute;
	top:0;
	right: 0;
	width: 48px;
	height: 50px;
	
}


.br_small {
	background: transparent url("../images/en/br-small.gif") 100% 100% no-repeat;
/*	position: absolute;
	bottom:0;
	right: 0;
	width: 5px;
	height: 5px;*/
}

.inner_br_small {
	background: transparent url("../images/en/inner-br-small.gif") 100% 100% no-repeat;
/*	position: absolute;
	bottom:0;
	right: 0;
	width: 5px;
	height: 5px;*/
}


/* =BOTTOM
================================================= */
#bottom {
	position: relative;
	/*overflow: hidden;*/
	height: 100%;
	color: #7c7c7c;
}

#bottom #main_br h1 {
	float: right;
}

#bottom #main_br #contact {
	float: right;
	text-align: right;
	padding: 0 0.7em;
	margin-right: 1em;
	border-right: dashed 1px #e20c15;
	font-size: 1em;
}

#bottom #main_br #contact p {
 margin: 0 0 0.5em 0;
}


#bottom #copyright {
	float: left;
	padding: 0.5em 0 0 0.5em;
}

/* =LOGIN FORM
================================================= */
#bottom #login_frame {
	float: left;
	width:20em;
	
}

#bottom form {
	padding: 0;
	float: left;
	width:100%;
}


#bottom fieldset {
	margin-top: 0;
	border: 0;

}

#bottom fieldset#details {
	margin-bottom: 0;
	padding: 0;
	float: left;
	color: black;
}

#bottom #details label,
#bottom #details input {

}

#bottom #details label {
	font-family: arial, helvetica, sans-serif;
	/*float: left;*/
	text-align: right;
	/*width: 5em;*/
	margin-right: 0.4em;
	margin-left: 0.6em;
	/*color: black;*/
}

#bottom #details input {
	/*margin-top: 0;*/
	/*margin-bottom: 0.3em;*/
	padding:0;
	margin:0;
	width: 5em;
}

#bottom #details .submit {
	background: none;
	border:none;
	max-width: 32px;
	width: 32px;
}

#bottom #error {
	font-size: xx-small;
	color: red;
	margin: 0.5em 0 0 1.8em;
	padding: 0;
	text-align: right;
}


#logout {
	text-align: left;
	padding: 0 1em 0 1em;
	font-family: arial, helvetica, sans-serif;
	color: black;
	font-size: 140%;
}

#logout #username {
	font-weight: bold;
}

#logout #logoutlink {
	font-size: x-small;
}

/* =BARCODE
================================================= */
#bottom #barcode {
	height: 3em;
	background: #0083D7 url("../images/en/background-barcode.gif") -35px 0 repeat-y;
	margin: 0 0 0.2em 1em;
	position: relative;
	
}

/* =CONTENT
================================================= */
/* See typography.css */
#content	{
	position: relative;

	min-height: 350px;
	/*height: 25em;*/
	text-align: left;
	
	margin: 15px 15px 8px 15px;
	
	background: #0083D7 url("../images/en/background-content.jpg") 0 0 repeat-y;
}


#main {
	float: left;
	color: white;
	position: relative;
	/*z-index: 10;*/
}

#main h2 {
	float: left;
	padding: 5px 3px 3px 5px;
}

#main #text {
	padding: 0.5em 0.5em 0.5em 40px;
	width: 22em;
	margin-left: 40px;
	position: relative;
	z-index: 10;
}

#main #text p {
 margin: 1em 0;
}

#main #text p img {
	border: solid 1px white;
	margin: 0 1em 0.5em 0;
	float: left;
}

#main #text ul, 
#main #text ol {
 	font-size: 0.7em;
}

#main #text table {
 color: white;
}

#main #x {
	background: transparent url("../images/en/background-x.gif") no-repeat 0 -30px;
	width: 375px;
	height: 300px;
	position:absolute;
	top: 0;
	left:74px;
}


/* =SUBMENU
================================================= */
ul#submenu {
	float: right;
	list-style-type: none;
	padding: 40px 0 0 0;
	margin-left: 0;
}

#submenu li {
	display: block;
	width: 13em;
	background: white url("../images/en/tl-small.gif") 0 0 no-repeat;
	border: solid black;
	border-width: 0 0 4px 0;

	margin-bottom: 0.5em;

	font-size: 0.6em;
	text-align: center;
	position: relative;
	
	text-shadow: 2px 2px 1px #3f3f3f;

}	

#submenu li .bl_small {
	height: 2.6em;
	padding: 3px 0px 3px 3px;
}

#submenu .subsection {
	background: #e20c15 url("../images/en/inner-tl-small.gif") 0 0 no-repeat;
	position: relative;
	margin: 0;

  	font-family: "arial black",arial, helvetica, sans-serif;
	text-transform: uppercase;

}



#submenu li a:link,
#submenu li a:visited {
	/*white-space: nowrap;*/
	text-decoration: none;
	display: block;
	/*color: #0083d7;*/
	/*color: #0099ff;*/
	color: #efefef;
	padding:0.7em 0.5em 0.5em 0.5em;
	min-height: 1.5em;
	font-style:oblique;
}

#submenu li a:hover,
#submenu li a:active {
	background: white;
	color:#e20c15;
	
}

/* =MENU
================================================= */

ul#menu {
	float: left;
	padding: 80px 0 0 0;
	list-style-type: none;		
	
	width: 155px;
}

#menu li {
	display: block;
	/*width: 12em;*/
	width: 120px;
	background: white url("../images/en/tr-small.gif") 100% 0 no-repeat;

/*	border: solid white;
	border-width: 3px 3px 3px 0;*/
	margin-bottom: 0.5em;

	font-size: 0.6em;
	text-align: center;
	position: relative;
}	


#menu li .br_small {
	min-height: 2.8em;
	padding: 4px 4px 4px 0;
}


#menu .section  {
	background: #001b50;
	position: relative;
	margin: 0;

  	font-family: "arial black",arial, helvetica, sans-serif;
	font-size: 110%;
	text-transform: uppercase;
	font-weight: normal;
	color: #73c9d4;

	text-shadow: 2px 2px 1px grey;

}

#menu .section .inner_br_small {
	min-height: 2.5em;
}


#menu li a:link,
#menu li a:visited {
	/*white-space: nowrap;*/
	text-decoration: none;
	display: block;
	/*color: #0083d7;*/
	/*color: #0099ff;*/
	color: #efefef;
	padding:0.5em;
	min-height: 1.7em;
	font-style:oblique;
}

#menu li a:hover,
#menu li a:active {
	background: white;
	color:#e20c15;
	
}

#menu li .section {
	background: #001b50 url("../images/en/inner-tr-small.gif") 100% 0 no-repeat;
}

#menu li#home .section  {
	background-color: #0067b0
	/*background: #0067b0 url("../images/en/background-menu-home.jpg") 0 0 repeat-x;*/
}
#menu li#about .section  {
	background-color: #ee4811;
}
#menu li#clients .section  {
	background-color: #ffa700;
}
#menu li#catalog .section  {
	background-color: #6eab23;
}
#menu li#hrc .section  {
	background-color: #0067b0;
}
#menu li#access .section  {
	background-color: #0083d7;
}
#menu li#others .section  {
	background-color: #001b50;
}


#menu abbr {
	border: none;
}

/*#menu a:hover abbr {
	border-bottom: 1px dotted;
}*/


/* =FOOTER
================================================= */
#footer {
	text-align: left;
	clear:both;
	background: black;
	font-size: 0.6em;
	font-family: arial, verdana, "trebuchet MS", helvetica, sans-serif;
	color: white;

}

#footer div {
	float: left;
	/*width: 48%;*/
	margin: 0.5em 0;
	padding: 0.5em;
}