@import "reset.css";
@import "silRoundStyles.css";

/* 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
www.raymondschieveen.nl
basic layout for Rijwielservice.nl
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/

html, body
{
	background-color: #0E0E0E;
	
	font-family:  Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height:30px;
}

#headerbar
{
	background-color: #50c5dc;
	background-image:url('../graphics/dot.gif');
}

#logosbar
{
	height:46px;
	background-color: #202020;
	background-image:url('../graphics/logos.jpg');
	background-repeat:no-repeat;
	background-position:center center;
}

#header
{
	position:relative;
	width: 940px;
	height: 270px;
	margin: 0 auto;
	padding:0 20px 0 20px;	
}

#logo
{
	float:left;
	margin:125px 0 0 0;
}

#fiets
{
	position:absolute;
	top:100px;
	right:40px;
}

#contentbar
{
	background-color: #202020;
}

#content
{
	clear:left;
	width: 940px;
	margin: 0 auto;
	padding:20px 20px 40px 20px;
	color:#fff;	
}

#footer
{
	clear:left;
	width: 940px;
	min-height:100px;
	/*padding:4px 0 0 20px;*/
	margin: 0 auto;
	font-size:80%;
	color:#999;
}

#footer a:link,
#footer a:visited
{
	color:#fff;
	text-decoration: underline;
}

#footer a:hover,
#footer a:active
{
	text-decoration: none	
}

#footer .left
{
	float:left;
	padding:8px 0 0 20px;	
}

#footer .right
{
	float:right;

	height:33px;

	background-color: #202020;	
	background-image:url('../graphics/lip_left.gif');
	background-repeat:no-repeat;
	background-position:bottom left;
}

#footer .rightright
{
	height:25px;

	padding:8px 12px 0 12px;
	
	background-image:url('../graphics/lip_right.gif');
	background-repeat:no-repeat;
	background-position:bottom right;
}

/* 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
styles
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/

a:link,
a:visited
{
	color:#55c6e4;
	text-decoration: underline;
}

a:hover,
a:active
{
	text-decoration: none	
}

b
{
	color:#55c6e4;
}

p
{
	padding:0 0 15px 0;
}

 ul, ol
{ 
	margin: 0 0 15px 0;
}

hr
{
	height: 1px;
	margin-top: 0.5em;
	border: none;
	border-bottom: 1px solid #4db5d0;
}

.spacer
{
	margin:10px 0 10px 0;
}

.translink:hover img
{
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}


/* 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
headings
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/

h1, h2
{
	font-weight:normal;
	color: #55c6e4;	
	background-color: transparent;
}

h1
{
	font-size: 190%;
	margin: 10px 0 20px 0;	
}

h2
{
	font-size: 140%;
	margin: 10px 0 10px 0;	
}

h3
{
	color:#fff;
	font-size: 120%;
	margin: 10px 0 5px 0;	
}

/* 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
navigation
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/

#navMain
{
	float: right;
	padding:40px 0 0 0;
}

#navMain ul
{
	float:right;
	list-style: none;
}

#navMain ul li
{
	list-style: none;
	display: block;
	float: left;
	margin:0 5px 0 0;
	
	height:24px;
	
	background-position:0 -24px;
	
	text-align:center;
}

#navMain ul li a
{
	display: block;
	height:24px;
	
	background-position:0 0;
}

#navMain ul li a:hover
{
	background-position:0 -24px;
}

#navMain .active
{
	background-position:0 -48px;
}

#mail
{
	float:right;
	margin:-15px 0 0 10px;
}

/* 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
banners
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/

#bannergrid
{
	width:100%;
}

#bannergrid td
{
	width:50%;
}

.banner
{
	position:relative;
	height:220px;
	padding:10px;
	margin:10px 0 10px 0;
	font-size:80%;
	color: #626262;
	
	background-color:#fff;
}

.banner a:link,
.banner a:visited
{
	color:#000000;
	text-decoration: underline;
}

.banner strong
{
	color:#000000;
	font-size: 120%;
}

.bannerimg
{
	height:100px;
}

/* 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/