/*******************************************************
********************************************************
* 		       	    Plantoo CSS layout                      	              *
*                                        by S.Thiebes                                              *
*                            Copyright  ©  Heiko Mania                                   *
********************************************************
********************************************************/
@charset "utf-8";
/*******************************************************
* 	                        define standard styles   	                        *
********************************************************/
body, h1, h2, h3, h4, h5, h6, p, ol, ul, form, blockquote, img
{
	padding: 0px;
	margin: 0px;
}

/*******************************************************
* 	               always show scrollbar in FireFox    	              *
********************************************************/
html
{
	overflow-y: scroll;
}

/*******************************************************
* 			defines the sites background    	              *
********************************************************/
body
{
	background-color: #f3f3f3;
	background-image: url(gfx/shadow.png);
	background-repeat: repeat-y;
	background-position: center;
}

/*******************************************************
*            defines the div that contains all further elements             *
********************************************************/
#container
{
	width: 739px;
	margin-left: auto;
	margin-right: auto;
	background-color: #ffffff;	
}

/*******************************************************
*            defines the div that contains all further elements             *
********************************************************/
#header
{
	width: 739px;
	height: 120px;
	margin-left: 0px;
	padding: 0px;
	background-color: #183e81;
	background-image: url(gfx/header_bg.png);
	background-repeat: repeat-x;
	float: left;
}

/*******************************************************
*                       positions the "tell" image vertically                         *
********************************************************/
#header img
{
	vertical-align: middle;
}

/*******************************************************
*                defines the div containing the "tell" image                    *
********************************************************/
#tell
{
	margin-left: 60px;
	border-width: 0;
}

/*******************************************************
*               defines the div representing the navigation bar             *
********************************************************/
#navbar
{
	width: 739px;
	height: 26px;
	margin: 0px auto;
	background-color: #ffffff;
	background-image: url(gfx/nav_bg.png);
	background-repeat: repeat-x;
	clear: both;
}

/*******************************************************
*                    defines the main table containing the tabs                 *
********************************************************/
#navbar ul
{
	text-align: center;
	width: 556px;
	margin: 0px auto;
}

/*******************************************************
*                    defines the main table containing the tabs                 *
********************************************************/
#navbar li
{
	display: inline;
}

/*******************************************************
*                              defines the tabs main style                                 *
********************************************************/
#navbar li a
{
	float: left;
	display: block;
	width: 109px;
	height: 26px;
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
	color: #B3B3B3;
	padding-top: 7px;
	text-decoration: none;
}

/*******************************************************
*                           defines the tabs selected style                              *
********************************************************/
#navbar li a.selected
{
	background-image: url(gfx/tab.png);
	background-repeat: no-repeat;
	color: #1B4590;
}

/*******************************************************
*                             defines the tabs hover style                                *
********************************************************/
#navbar li a:hover
{
	color: #1B4590;
}

/*******************************************************
*            defines the div containing the content of tab1                  *
********************************************************/
#tab1_content
{
	width: 740px;
	background-image: url(gfx/clock.png);
	background-repeat: no-repeat;
	background-position: 90% 5px;
}
/*******************************************************
*            defines the div containing the content of tab2                  *
********************************************************/
#tab2_content
{
	width: 740px;
	height: 100%
}
/*******************************************************
*            defines the div containing the content of tab3                  *
********************************************************/
#tab3_content
{
	width: 740px;
	height: 100%
}
/*******************************************************
*            defines the div containing the content of tab4                  *
********************************************************/
#tab4_content
{
	width: 740px;
	height: 100%
}
/*******************************************************
*            defines the div containing the content of tab5                  *
********************************************************/
#tab5_content
{
	width: 740px;
	height: 100%
}


/*******************************************************
*                   defines the div containing steps of tab1                      *
********************************************************/
#content_steps
{
	width: 740px;
}

/*******************************************************
*            defines the divs representing the different steps             *
********************************************************/
#step1, #step2, #step3
{
	float: left;
	width: 228px;
	height: 120px;
	background-image: url(gfx/step.png);	
	margin-left: 14px;
	margin-top: 25px;
	margin-bottom: 20px;
	
}
/*******************************************************
*                  defines the div containing a steps number                   *
********************************************************/
#number
{
	float: left;
	width: 27px;
	height: 120px;
	margin-right: 5px;
}
/*******************************************************
*                defines the div containing a steps content                     *
********************************************************/
#step_content
{
	width: 195px;
	height: auto;
	margin-top: 5px;
}

/*******************************************************
*                            defines the footer divs layout                             *
********************************************************/
#footer
{
	width: 440px;
	height: 100px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 100px;
	background-color: #ffffff;
	vertical-align: bottom;
}
/*******************************************************
*                      defines the footers images positions                        *
********************************************************/
#footer img
{
    vertical-align: bottom;
}

/*******************************************************
*                     following: definition of text types                             *
********************************************************
*               defines  first heading used for "caption (s)"                   *
********************************************************/
h1
{
	font-family: BPreplay, sans-serif;
	font-weight: regular;
	font-size: 2em;
	margin-top: 10px;
	margin-left: 10px;
	margin-bottom: 0px;
	color: #1B4590;
}

/*******************************************************
*           defines second heading used for "subcaption (s)"              *
********************************************************/
h2
{
	font-family: BPreplay, sans-serif;
	font-weight: regular;
	font-size: 1.5em;
	margin-top: 35px;
	margin-left: 10px;
	margin-bottom: 0px;
	color: #1B4590;
}
/*******************************************************
*            defines  third heading used for the steps number              *
********************************************************/
h3
{
	font-family: Arial, sans-serif;
	font-weight: bold;
	font-size: 1.7em;
	margin-top: 10px;
	margin-left: 4px;
	margin-bottom: 0px;
	color: #ffffff;
}
/*******************************************************
*            defines fourth heading used for the steps caption            *
********************************************************/
h4
{
	font-family: Arial , sans-serif;
	font-weight: regular;
	font-size: 1.08em;
	color: #ffffff;
}

/*******************************************************
*                      defines the normal, black texts style                         *
********************************************************/
h5
{
	font-family: Arial, sans-serif;
	font-weight: normal;
	font-size: 0.7em;
	margin-top: 10px;
	margin-left: 10px;
	margin-bottom: 0px;
	margin-right: 10px;
	color: #000000;
}