/* Stylesheet for www.hocem.com - developed by fob marketing : http://www.fob-marketing.de */ 

body { 
  /*  background-color: #E8EBF4; */ 
	background-color: #2A4676; 
	text-align: center; 
	margin: 0; 
	padding: 0; 
	margin-left: auto; 
	margin-right: auto; 
	font-family: Helvetica, Arial, Sans-Serif; 
	font-size: 62.5%; /* Resets 1em to 10px */ 
    /* background-image: url(../images/page_bg.gif); */ 
    background-position: center top; 
	background-repeat: repeat-y; 
	} 

	
#page { 
    width: 800px; 
	background-color: #C8D1E7; 
	border-left: 10px solid #BAC7E7; 
	border-right: 10px solid #BAC7E7; 
	text-align: center; 
	margin-left: auto; 
	margin-right: auto; 
	} 
	
#start_pic { 
    width: 800px; 
	height: 533px; 
	text-align: center; 
	background-image: url(../images/hocem_start.jpg); 
	background-position: center top; 
	background-repeat: no-repeat; 
	} 

#service_pic { 
    width: 800px; 
	height: 144px; 
	text-align: center; 
	background-image: url(../images/oil_services.jpg); 
	background-position: center top; 
	background-repeat: no-repeat; 
	} 

#tank_pic { 
    width: 800px; 
	height: 144px; 
	text-align: center; 
	background-image: url(../images/tanks.jpg); 
	background-position: center top; 
	background-repeat: no-repeat; 
	} 

#freighter_pic { 
    width: 800px; 
	height: 144px; 
	text-align: center; 
	background-image: url(../images/freighter.jpg); 
	background-position: center top; 
	background-repeat: no-repeat; 
	} 	
/* 
#contact_pic { 
    width: 800px; 
	height: 260px; 
	text-align: left; 
	background-image: url(../images/contact_bg.jpg); 
	background-position: center top; 
	background-repeat: no-repeat; 
	} 
*/ 

#contact_pic { 
    width: 800px; 
	height: 329px; 
	text-align: left; 
	background-image: url(../images/contact_bgneu.jpg); 
	background-position: center top; 
	background-repeat: no-repeat; 
	margin: 5px 0; 
	padding: 0; 
	} 

/* h1 Startseite */ 

.slogan { 
    color: #fff; 
	text-align: center; 
	padding-top: 350px; 
	font-size: 34px; 
	font-weight: bold; 
	margin: 0px; 
	} 
	
#hocem_top { 
    height: 5px; 
	margin: 0px; 
	padding: 0px; 
	} 
	
#header { 
    width: 800px; 
	margin-left: auto; 
	margin-right: auto; 
	} 
	
#header_logo { 
    float: left; 
	margin-right: 100px; 
	padding-top: 10px; 
	} 
	
#header_nav { 
    float: right; 
	width: 280px; 
	margin: 0; 
	padding: 0; 
	} 
	
#content { 
    width: 800px; 
	font-size: 1.2em; 
	background-color: #C8D1E7; 
    _height: 150px; 
	min-height: 150px; 
	} 
#content2 { 
    width: 800px; 
	font-size: 1.2em; 
	} 	
	
#contentprod { 
    width: 800px; 
	_height: 460px; 
	min-height: 460px; 
	font-size: 1.2em; 
	background-color: #C8D1E7; 
    margin-top: 20px; 
	background-image: url(../images/oil_table.jpg); 
	background-position: top right; 
	background-repeat: no-repeat; 
} 

#contentprodbot { 
    width: 550px; 
	margin-bottom: 30px; 
	text-align: center; 
	margin-left: auto; 
	margin-right: auto; 
	border-bottom: 1px solid #fff; 
	} 

#listarea { 
    width: 800px; 
	font-weight: bold; 
	text-align: left; 
	line-height: 25px;
	} 

#textarea { 
    text-align: left; 
	margin-top: 10px; 
	margin-left: 10px; 
	margin-right: 10px;
	} 
	
#centercontent { 
    width: 600px; 
	padding-left: 
	50px; 
	margin-top: 20px; 
	} 
	
#footer { 
    background-color: #C8D1E7; 
	height: 78px; 
	text-align: right; 
	} 

.clear { 
    clear: both; 
	margin: 0; 
	padding: 0; 
	line-height: 0px; 
	} 

hr { 
 /* color: #E8E8E8; */ 
 	color: #fff; 
	height: 1px; 
	margin-top: 1px; 
	margin-bottom: 1px; 
	padding: 0; 
	width: 800px; 
	} 
	
a {
    color: #2A4678; 
	}

a:link {
    color: #2A4678; 
	}

a:visited {
    color: #2A4678; 
	} 

a:hover { 
    color: #859DC8; 
	}

a:active {
    color: #2A4678; 
	}

ul { 
	text-align: left; 
	padding: 0; 
	margin: 0; 
	margin-top: 8px; 
	margin-bottom: 5px; 
	}

li { 
    width: 250px; 
	list-style: none; 
	font-weight: bold; 
	font-family: Helvetica, Arial, Verdana, Sans-Serif; 
	color: #666; 
    border-bottom: 1px solid #FFFFFF; 
	font-size: 14px; 
	text-align: left; 
	margin: 0; 
	padding: 0; 
	} 

li a { 
	height: 23px; 
	background-color: #BAC7E7; 
	background: url(../images/min_drop.gif); 
	background-repeat: no-repeat; 	
	display: block; 
	color: #666; 
	text-decoration: none; 
	font-weight: normal; 
	border: 1px solid #666; 
	border-left-width: 0px; 
	border-right-width: 0px; 
	border-top-color: #fff; 
	cursor: pointer; 
	} 

li a span { 
    color: #666; 
	height: 23px; 
	display: block; 
	text-indent: 4px; 
	margin-left: 20px;  
    background-color: #BAC7E7; 
	padding-top: 3px; 
	padding-left: 4px; 
	} 
	
li i, li a span i { 
	color: #FFE400; 
	font-weight: bold; 
	margin-right: 10px; 
	} 

li a:hover { 
	background-color: #C8D1E7; 
	background-image: url(../images/min_drop.gif); 
	background-repeat: no-repeat; 
	color: #21569A; 
	} 

li a:hover span { 
	color: #21569A; 
	background-color: #C8D1E7; 
	} 

li a:active { 
	background-color: #C8D1E7; 
	background-image: url(../images/min_drop.gif); 
	background-repeat: no-repeat; 
	color: #21569A; 
	} 

li a:active span { 
	color: #21569A; 
	background-color: #C8D1E7; 
	} 

.ul_contact { 
    margin-left: 10px; 
	margin-top: 30px; 
	} 
	
.ul_contact_c { 
	float: left; 
    margin-left: 10px; 
	margin-right: 20px; 
	width: 250px;
	} 

.ul_contact_c li { 
    width: 250px; 
 /* background-image:url(../images/med_drop.gif); */ 
	background-repeat: no-repeat; 
	text-indent: 30px; 
	color: #000; 
	border: none; 
	margin-bottom: 20px; 
	} 
	
.ul_contact_c li span { 
	padding-left: 30px; 
	margin-top: 5px; 
	} 

.li_contact { 
    width: 450px; 
	background-image:url(../images/med_drop.gif); 
	background-repeat: no-repeat; 
	text-indent: 30px; 
	color: #000; 
	margin-bottom: 20px; 
	} 
	
.li_contact_1 { 
	background-image:url(../images/med_drop1.gif); 
	}
	
.li_contact_2 { 
	background-image:url(../images/med_drop2.gif); 
	}
	
.li_contact_3 { 
	background-image:url(../images/med_drop3.gif); 
	}
	
.li_contact_4 { 
	background-image:url(../images/med_drop4.gif); 
	}
	
.li_contact_5 { 
	background-image:url(../images/med_drop5.gif); 
	}
	
.li_contact_6 { 
	background-image:url(../images/med_drop6.gif); 
	}
	
.li_contact_7 { 
	background-image:url(../images/med_drop7.gif); 
	}
	
.li_contact_8 { 
	background-image:url(../images/med_drop8.gif); 
	}
	
.li_contact_9 { 
	background-image:url(../images/med_drop9.gif); 
	}

.ul_prod { 
    margin-left: 10px; 
	margin-top: 15px; 
	} 

.li_prod { 
    width: 250px; 
	background-image:url(../images/med_drop.gif); 
	background-repeat: no-repeat; 
	text-indent: 30px; 
	color: #000; 
	line-height: 1.8em; 
	} 

.small {
	font-family: Helvetica, Arial, Sans-Serif;
	font-size: 0.9em;
	line-height: 1.5em;
	}

.blue_small { 
   	font-family: Helvetica, Arial, Sans-Serif; 
	font-size: 0.9em; 
	line-height: 1.4em; 
	margin-bottom: 10px; 
	color: #21569A; 
	text-align: left; 	
	} 

.smallbold {
	font-family: Helvetica, Arial, Sans-Serif;
	font-size: 0.9em;
	font-weight: bold; 
	line-height: 1.5em;
	}

h1, h2, h3 {
	font-family: Helvetica, Arial, Sans-Serif; 
	font-weight: bold; 
	}

h1 {
	font-size: 3.6em; 
	text-align: left; 
	padding-left: 10px; 
	}
	
.h1_bori { 
    padding-top: 100px; 
	text-align: right; 
	margin-right: 10px; 
	margin-bottom: 0px;
	} 

#headline { 
	font-size: 3.6em; 
	font-weight: bold; 
	text-align: left; 
	padding-left: 10px; 
	margin-top: 15px; 
	color: #21569A; 
	} 

#headerimg .description { 
	font-size: 1.2em; 
	text-align: center; 
	}

h2 {
	font-size: 1.6em; 
	}

h2.pagetitle {
	font-size: 1.6em; 
	}

h3 {
	font-size: 1.3em; 
	}
	
.h3terminals { 
	margin: 10px 0 0 10px; 
	} 

h1, h1 a, h1 a:hover, h1 a:visited, #headerimg .description {
	text-decoration: none; 
	color: #C8D1E7; 
	}

h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {
	color: #333; 
	}

h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited {
	text-decoration: none; 
	} 
	
.bold { 
    font-weight: bold; 
	} 

.center { 
    text-align: center; 
	margin-left: auto; 
	margin-right: auto; 
	} 
	
.center_bg { 
    text-align: center; 
	margin-left: auto; 
	margin-right: auto; 
	background-color: #BAC7E7; 
	} 
	
p { 
    font-size: 1.2em; 
	font-family: Helvetica, Arial, Sans-Serif; 
	margin-left: 10px; 
	text-align: left; 
	} 
	
.lieinzug { 
	list-style-position: outside; 
	list-style-image: url(../images/med_drop.gif); 
	list-style-type: none; 
	font-size: 1.4em; 
	font-weight: bold; 
	color: #000; 
	line-height: 1.5em; 
	border: none; 
	width: 500px; 
}

/* Float-Boxen für 3er-Reihe */ 

.boxone { 
    float: left; 
	width: 250px; 
	margin-left: 5px; 
	height: 270px; 
	background-color: #E8EBF4; 
	padding-top: 2px; 
	border: 5px solid #BAC7E7; 
	margin-left: 120px; 
	} 
	
.boxtwo { 
    float: left; 
	width: 250px; 
	margin-left: 5px; 
	height: 270px; 
	background-color: #E8EBF4; 
	padding-top: 2px; 
	border: 5px solid #BAC7E7;
	margin-left: 30px; 	 
} 
	
.boxthree { 
    float: left; 
	width: 250px; 
	margin-left: 5px; 
	height: 270px; 
	background-color: #E8EBF4; 
	padding-top: 2px; 
	border: 5px solid #BAC7E7; 
	} 
	
.hotpicfloat { 
	float: right; 
	margin: 0; 
	padding: 0; 
	margin-left: 4px; 
	width: 230px; 
	min-height: 1100px; 
	background-color: #E8EBF4; 
	border: 10px solid #BAC7E7; 
	} 

.hotpicad { 
    border: 10px solid #BAC7E7; 
	text-align: center; 
	width: 470px; 
	margin-top: 42px;
	}