/* ============================================	
    hatraco
    Developed by iCREW Creative Web Development	
    Copyright - http://www.icrew.nl		
   ============================================	
	blue 		#008dcb
	lightblue		#c0cff6
	orange		#ff8e01
   ============================================	
*/

* {margin:0; padding:0}
body {background:#008dcb url("../media/bg_body.gif") repeat-x; font:12px arial, helvetica, sans-serif}
	
h1,h2,h3,h4,h5,h6 {padding:0 0 10px 0; color:#af0707; font-weight:bold}
h1	{font-size: 1.6em} h4 {font-size: 1.3em}
h2	{font-size: 1.5em} h5 {font-size: 1.2em}
h3	{font-size: 1.4em} h6 {font-size: 1.0em}

ul	{margin:0 0 0 16px}
ol	{margin:0 0 0 35px}

p {margin:0 0 10px 0}

ul a:link, ul a:visited {color:#043868; text-decoration:none}
ul a:hover, ul a:active {background:none; text-decoration:underline}

a:link, a:visited {color:#af0707; text-decoration:none}
a:hover, a:active {background:none; text-decoration:underline}

.hr {background:url("../media/hr.gif") repeat-x; width:100%; height:2px; margin:15px 0}
.hr2 {background:url("../media/hr2.gif") repeat-x; width:100%; height:2px; margin:15px 0}
.hr3 {background:url("../media/hr3.gif") repeat-x; width:925px; height:2px; margin:5px auto}

/*
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden}
*/
.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */


/* Body
 ============================================*/

	
/* Wrapper & Header
 ============================================*/
#wrapper {position:relative; width:960px; margin:0 auto}
#header {background:#9dd3eb url("../media/bg_header.gif") no-repeat; width:960px}
	#header_bottom {background:url("../media/bg_header_bottom.gif") no-repeat; width:960px; height:9px; margin-bottom:5px}

#logo {position:absolute; background:url("../media/logo_bg.png") left bottom no-repeat;  top:10px; left:27px; width:300px; height:69px; z-index:10}
	#logo img {border:0px}

#search {position:absolute; background:url("../media/bg_searchbox.gif") left bottom no-repeat; top:10px; left:600px; width:350px; height:45px; font:bold 12px arial, helvetica, sans-serif}
	#search span {color:#ff9000; margin:0 0 0 5px; }
	#search form {margin:7px 0 0 0; padding:0}
	
	#block_search {border:0px; margin:0 30px 3px 10px; width:235px}
	#block_searchbtn {border:0; width:63px; background:none}
	#block_select {border:0px; width:100px; margin:0px 20px 0 5px}

#breadcrumb {padding:82px 0 70px 30px; width:910px; font:9px arial, helvetica, sans-serif}
/*#breadcrumb {position:absolute; top:80px; left:30px; width:910px; font:9px arial, helvetica, sans-serif}*/
	#breadcrumb img {vertical-align:middle}
	#breadcrumb a:link, #breadcrumb a:visited {color:#9D9D9D; text-decoration:none}
	#breadcrumb a:hover, #breadcrumb a:active {background:none; text-decoration:underline}

/* #banner {background:url("../media/_banner.gif") no-repeat; height:235px;}*/

#banner_visual {position:absolute; top:180px; left:10px; width:340px; height:235px}


#language_bar {position:absolute; top:128px; left:680px; width:290px; color:#3399cc; background:url("../media/ico_langON.gif") 148px 0 no-repeat}

#language {margin:0; padding:0}
	#language li {float:left; list-style-type:none;}
	#language span {float:left; display:none}
	#language a {display:block; width:28px; height:26px}

	#lang01 a:hover {background:url("../media/ico_eng2.gif") no-repeat}
	#lang02 a:hover {background:url("../media/ico_fra2.gif") no-repeat}
	#lang03 a:hover {background:url("../media/ico_rus2.gif") no-repeat}
	#lang04 a:hover {background:url("../media/ico_ger2.gif") no-repeat}
	
	#lang01_active {background:url("../media/ico_eng2.gif") no-repeat}
	#lang02_active {background:url("../media/ico_fra2.gif") no-repeat}
	#lang03_active {background:url("../media/ico_rus2.gif") no-repeat}
	#lang04_active {background:url("../media/ico_ger2.gif") no-repeat}
	
 /* Menu
 ============================================*/
#menu {position:absolute; top:125px; left:0px}
	#menu a:link, #menu a:visited {color:white; text-decoration:none}
	#menu a:hover, #menu a:active {background:none; text-decoration:underline}
	
	/*no padding*/
	#menu ul li {float: left; list-style: none; font-weight:bold; margin:0 10px 0 0}
	#menu ul li a {z-index:10; display: block; float: left; height: 24px; position: relative; overflow: hidden;}

	#menu_home a, #menu_hatraco a, #menu_news a, #menu_products a, #menu_manufacturers a, #menu_contact a {padding:10px 0 0 15px}

	#menu_home a {width:45px}
	#menu_hatraco a {width:70px}
	#menu_news a {width:55px}
	#menu_products a {width:80px}
	#menu_manufacturers a {width:115px}
	#menu_contact a {width:70px}

	#menu li.background {background: url("images/bg_menu_right.png") no-repeat top right !important; background: url("images/bg_menu_right.gif") no-repeat top right; z-index: 8; position: absolute; visibility: hidden;}
	#menu .background .left {background: url("images/bg_menu.png") no-repeat top left !important; background: url("images/bg_menu.gif") no-repeat top left; height: 34px; margin-right: 9px; /* 7px is the width of the rounded shape */}

	.current {text-decoration:underline; color:white}


 /* Menu JQUERY
 ============================================*/
        #menu {position:absolute; top:125px; left:0px; height: 35px; }
        #menu li {float: left; list-style: none }

        #menu li.back {background: url("../css/images/lava.gif") no-repeat right -34px; width: 9px; height: 35px; z-index: 8; position: absolute}
        #menu li.back .left {background: url("../css/images/lava.gif") no-repeat top left; height: 35px; margin-right: 9px; /* 7px is the width of the rounded shape */}

        #menu li a {	padding:3px 8px 0 10px;
                        font-weight: bold;
                        text-decoration: none;
                        color: #fff;
                        outline: none;
                        text-align: center;
                        top: 7px;
                        text-transform: uppercase;
                        letter-spacing: 0;
                        z-index: 10;
                        display: block;
                        float: left;
                        height: 35px;
                        position: relative;
                        overflow: hidden;
                        margin: auto 10px auto 8px;    
                    }

                        #menu li a:hover, .lavaLampWithImage li a:active, .lavaLampWithImage li a:visited {border: none}


	
 /* Submenu
 ============================================*/
#submenu {background:#9dd3eb; width:890px; margin:0 auto; padding: 0 35px}
	#submenu h5 {font-weight:bold; color:black; margin:6px 0}
	#submenu li {float:left; margin:0 10px 5px 0; width:170px; list-style-type:none; font:bold 13px arial}
	#submenu a:link, #submenu a:visited {color:#386c9e; text-decoration:none}
	#submenu a:hover, #submenu a:active {color:white; text-decoration:underline}
	


/* content
 ============================================*/
#containers {}
#containers_content {}


 /* columns PORTAL
 ============================================*/
.container_portal { float:left; clear:left; width:100%; padding:0; }
.box_portal1 h6, .box_portal2 h6, .box_portal3 h6 {color:white; font:bold 12px arial; margin:0; padding:0}

.box_portal1 { float:left; width:210px; margin:0 19px 0 0; padding:0; background-color:white; border-bottom:4px solid #b5dbeb}
	.box_portal1_header {background:#1d99cf url("../media/bg_box1Header.gif") no-repeat; padding:10px 0 10px 20px}
	.box_portal1_content {background:white; padding:10px 20px}
		.box_portal1_content ul {margin:0 0 10px 0}
		.box_portal1_content li {background:url("../media/bullet_01.gif") 0 3px no-repeat; margin:0;  padding:0 0 0 20px; list-style-type:none}

.box_portal2 { float:left; width:432px; margin:0 19px 0 0; background-color:#74c1e3; border-bottom:4px solid #b5dbeb}
	.box_portal2_header {background:#1d99cf url("../media/bg_box2Header.gif") no-repeat; padding:10px 0 10px 20px}
	.box_portal2_content {background:#74c1e3 url("../media/bg_box2Content.gif") no-repeat; padding:10px 20px}

.box_portal3 { float:left; width:280px; background-color:white; border-bottom:4px solid #b5dbeb}
	.box_portal3_header {background:#1d99cf url("../media/bg_box3Header.gif") no-repeat; padding:10px 0 10px 20px}
	.box_portal3_content {background:white; padding:10px 20px}
		.box3_content img {border:1px solid #74c1e3}

.contain_portalWidth {width: 960px;}




 /* columns SUB 4 columns
 ============================================*/

.container_sub { float:left; clear:left; width:100%; padding:0; }
.box_sub1 h6, .box_sub2 h6, .box_sub3 h6, .box_sub4 h6 {color:white; font:bold 12px arial; margin:0; padding:0}

.box_sub1 {float:left; width:210px; margin:0 16px 0 0; background-color:white; border-bottom:4px solid #b5dbeb}
	.boxcontent_sub1 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.boxcontent_sub1_header {background:#6bbbe0 url("../media/bg_box1Header2.gif") no-repeat; padding:10px 0 10px 20px}
	.boxcontent_sub1_content {background:white; padding:10px 20px}
		.boxcontent_sub1_content ul {margin:0 0 10px 0}
		.boxcontent_sub1_content li {background:url("../media/bullet_01.gif") 0 3px no-repeat; margin:0;  padding:0 0 0 20px; list-style-type:none}
		
.box_sub2 {float:left; width:210px; margin:0 16px 0 0; background-color:white; border-bottom:4px solid #b5dbeb}
	.boxcontent_sub2 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.boxcontent_sub2_header {background:#6bbbe0 url("../media/bg_box1Header2.gif") no-repeat; padding:10px 0 10px 20px}
	.boxcontent_sub2_content {background:white; padding:10px 20px}
	
.box_sub3 {float:left; width:210px; margin:0 18px 0 0; background-color:white; border-bottom:4px solid #b5dbeb}
	.boxcontent_sub3 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.boxcontent_sub3_header {background:#6bbbe0 url("../media/bg_box1Header2.gif") no-repeat; padding:10px 0 10px 20px}
	.boxcontent_sub3_content {background:white; padding:10px 20px}
		.boxcontent_sub3_content img {border:1px solid #74c1e3}
		.boxcontent_sub3_content ul {margin:0 0 10px 0}
		.boxcontent_sub3_content li {background:url("../media/ico_pdfwhite.gif") 0 3px no-repeat; margin:0;  padding:10px 0 4px 30px; list-style-type:none}

.box_sub4 {float:left; width:280px; background-color:white; border-bottom:4px solid #b5dbeb}
	.boxcontent_sub4 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.boxcontent_sub4_header {background:#6bbbe0 url("../media/bg_box3Header2.gif") no-repeat; padding:10px 0 10px 20px}
	.boxcontent_sub4_content {background:white; padding:10px 20px}
		.boxcontent4_content img {border:1px solid #74c1e3}
		.boxcontent4_content ul {margin:10px 0 5px 0}
		.boxcontent4_content li {margin:0;  padding:5px 0 0 0; list-style-type:none}
		.boxcontent4_content li  img {border:0; padding:0 10px 0 0; vertical-align:middle }


.contain_subWidth {width: 960px}









 /* columns
 ============================================
#contain_Left , #contain_Middle, #contain_Right {float:left}
.box1 h6, .box2 h6, .box3 h6 {color:white; font:bold 12px arial; margin:0; padding:0}

#contain_Left {width:210px; margin:0 19px 0 0}
	.box1 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.box1_header {background:url("../media/bg_box1Header.gif") no-repeat; padding:10px 0 10px 20px}
	.box1_content {background:white; padding:10px 20px}
		.box1_content ul {margin:0 0 10px 0}
		.box1_content li {background:url("../media/bullet_01.gif") 0 3px no-repeat; margin:0;  padding:0 0 0 20px; list-style-type:none}
		
#contain_Middle {width:432px; margin:0 19px 0 0}
	.box2 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.box2_header {background:url("../media/bg_box2Header.gif") no-repeat; padding:10px 0 10px 20px}
	.box2_content {background:#74c1e3 url("../media/bg_box2Content.gif") no-repeat; padding:10px 20px}
	
#contain_Right {width:280px;}
	.box3 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.box3_header {background:url("../media/bg_box3Header.gif") no-repeat; padding:10px 0 10px 20px}
	.box3_content {background:white; padding:10px 20px}
		.box3_content img {border:1px solid #74c1e3}
  
   columns Content
 ============================================
#contain_content_1 , #contain_content_2, #contain_content_3, #contain_content_4 {float:left}
.boxcontent1 h6, .boxcontent2 h6, .boxcontent3 h6, .boxcontent4 h6 {color:white; font:bold 12px arial; margin:0; padding:0}

#contain_content_1 {width:210px; margin:0 16px 0 0}
	.boxcontent1 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.boxcontent1_header {background:url("../media/bg_box1Header2.gif") no-repeat; padding:10px 0 10px 20px}
	.boxcontent1_content {background:white; padding:10px 20px}
		.boxcontent1_content ul {margin:0 0 10px 0}
		.boxcontent1_content li {background:url("../media/bullet_01.gif") 0 3px no-repeat; margin:0;  padding:0 0 0 20px; list-style-type:none}
		
#contain_content_2 {width:210px; margin:0 16px 0 0}
	.boxcontent2 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.boxcontent2_header {background:url("../media/bg_box1Header2.gif") no-repeat; padding:10px 0 10px 20px}
	.boxcontent2_content {background:white; padding:10px 20px}
	
#contain_content_3 {width:210px; margin:0 18px 0 0}
	.boxcontent3 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.boxcontent3_header {background:url("../media/bg_box1Header2.gif") no-repeat; padding:10px 0 10px 20px}
	.boxcontent3_content {background:white; padding:10px 20px}
		.boxcontent3_content img {border:1px solid #74c1e3}
		.boxcontent3_content ul {margin:0 0 10px 0}
		.boxcontent3_content li {background:url("../media/ico_pdfwhite.gif") 0 3px no-repeat; margin:0;  padding:10px 0 4px 30px; list-style-type:none}

#contain_content_4 {width:280px;}
	.boxcontent4 {border-bottom:3px solid #b5dbeb; margin:0 0 20px 0}
	.boxcontent4_header {background:url("../media/bg_box3Header2.gif") no-repeat; padding:10px 0 10px 20px}
	.boxcontent4_content {background:white; padding:10px 20px}
		.boxcontent4_content img {border:1px solid #74c1e3}
		.boxcontent4_content ul {margin:10px 0 5px 0}
		.boxcontent4_content li {margin:0;  padding:5px 0 0 0; list-style-type:none}
		.boxcontent4_content li  img {border:0; padding:0 10px 0 0; vertical-align:middle }
*/






		
  /* Footer
 ============================================*/
#footer {color:#80c7e5; margin:0 0 20px 20px; line-height:16px}
	#footer h6 {color:#b4d2ed; font-weight:bold}
	#footer a:link, #footer a:visited {color:white; text-decoration:underline}
	#footer a:hover, #footer a:active {color:white; text-decoration:none}
	
  /* PORTAL page
 ============================================*/	
#box_prod {height:90px; margin:0; padding:0}
#box_prodIMG {float:left; width:90px}
	#box_prodIMG img {border:1px solid #74c1e3}
#box_prodTXT {float:left; width:300px}
	#box_prodTXT h5 {margin:0; padding:0; color:#083c6e; font:bold 14px arial}
	#box_prodTXT img {border:0px; vertical-align:middle}

	#box_prodTXT a:link, #box_prodTXT a:visited {color:#083c6e; font:12px arial, helvetica, sans-serif; text-decoration:underline}
	#box_prodTXT a:hover, #box_prodTXT a:active {color:white; text-decoration:none}


/* SUB page
 ============================================*/	
 #subcontainer {background:white}
	#subcontainerLeft {float:left; width:605px; padding:20px 30px 20px 30px}
	#subcontainerRight {float:left; width:280px; padding:20px 15px 20px 0px}
	.subcontainerRight_boxcontent {width:240px; padding:0 20px}
	
 #categoryhead {font-weight:bold; color:black; width:900px; margin:0 auto; padding:15px 0}

#navtabs {background:#9dd3eb url("../media/bg_header_bottom2.gif") bottom no-repeat; float: left; list-style-type: none; padding: 0; width:945px; margin:0; padding:0 0 0 15px}
#navtabs li {float: left; padding: 8px 0 6px 14px}
#navtabs li a {padding: 8px 18px 8px 0; text-decoration:none; color:#386c9e; font:bold 13px arial}
#navtabs li a:hover {color:white; text-decoration:underline}
#navtabs li.current-cat {background: url(../media/tableft_active.gif) no-repeat left top}
#navtabs li.current-cat a {background: url(../media/tabright_active.png) no-repeat right top;	color: black; font-weight:bold;  text-decoration:none}

#header_bottom {background:#9dd3eb url("../media/bg_header_bottom.gif") bottom no-repeat; height:6px; width:945px; margin:0 0 10px 0; padding:0 0 0 15px}


/* SUB page CONTACT
 ============================================*/	
 #subcontainer_bg {background:url(../media/subcontainer_bg.gif) repeat-y; height:100%}
 #subcontainerLeft_contact {float:left; width:405px; padding:20px 30px 20px 30px}
 #subcontainerRight_contact {float:left; width:460px; padding:20px 15px 20px 20px;}
 #subcontainerRight_boxheaderblue h6,  #subcontainerRight_boxheadergold h6 {color:white}
 #subcontainerRight_boxheaderblue {background: url(../media/bg_box3Header.gif) no-repeat; width:260px; height:30px; padding:12px 0 0 20px}
 #subcontainerRight_boxheadergold {background: url(../media/bg_box3Header2.gif) no-repeat; width:260px; height:30px; padding:12px 0 0 20px}
	
	
/*
#submenu {width:905px; margin:0 auto;}
	#navtabs h5 {font-weight:bold; color:black; margin:6px 0}
	#submenu li {float:left; margin:0 10px 5px 0; width:170px; list-style-type:none; font:bold 13px arial}
	#submenu a:link, #submenu a:visited {color:#386c9e; text-decoration:underline}
	#submenu a:hover, #submenu a:active {text-decoration:none}
	
	.sub_current {text-decoration:underline; color:white}
	*/






/* SUB page login
 ============================================*/	
#frmLogin {position:relative; /*background:url(../media/bg_login.gif) top right no-repeat;*/ height:90px; margin:0 0 10px 0}
#frmLogin ul {margin:0; padding:0}
#frmLogin ul li {background:url(../media/bg_loginbox.gif) right no-repeat; list-style-type:none; margin: 0 ; padding:7px 0 0 0; width:100%; height:24px}
#frmLogin span {display:block; width:90px; float:left}


#frmLogin ul li#ExtEmail, #frmLogin ul li#ExtPassword {background:url(../media/bg_loginbox.gif) 80px no-repeat; list-style-type:none; margin: 0 ; padding:7px 0 0 0; width:100%; height:24px}


#frmLogin ul input {float:left; width:140px; border:0; background:none}

#block_loginbtn {border:0; margin:0px 0 0 155px; width:85px; height:28px; background:url(../media/bg_loginboxbtn.gif) right no-repeat; }

#frmLogin_register {position:absolute; top:62px; left:0; width:120px}
	#frmLogin_register a:link, #frmLogin_register a:visited {color:#e87f3d; text-decoration:none}
	#frmLogin_register a:hover, #frmLogin_register a:active {text-decoration:underline}


/* SUB page contact
 ============================================*/	
#contact_submitbtn {background:url(../media/bg_contactbtn.gif) no-repeat; width:83px; height:26px; border:0px}
