/*
 * ----------------------------------------------------------
 * Title:		123Vertaal - CSS Main Stylesheet
 * Author:		Kenny van Ooijen
 * Date:		27/11/2009
 * ----------------------------------------------------------
 * MediaFlirt - Webdesign bureau
 * www.mediaflirt.nl
*/


/* Algemene styles
 * ---------------------------------------------------------- */
	 html { background-color: #ffffff; height: 100%; }
	 body { font: 12px Arial; margin: 0px auto; height: 100%; }


/* Container
 * ---------------------------------------------------------- */
	 .container { position: relative; width: 1000px; margin: 0px auto; background-color: #ffffff; }

 /* Header
 * ---------------------------------------------------------- */
	 .header { float: left; width: 1000px; height: 134px; background: url('../images/header.gif') no-repeat; }
	 .header h1 { font: 22px Arial; font-weight: bold; color: #ffffff; margin: 0px; padding: 20px 0px 0px 25px; }
	 .header form { float: right; width: 615px; margin: 40px 0px 0px 0px; padding: 0px; }
	 .header fieldset { margin: 0px; padding: 0px; border: 0px; }
	 .header label { float: left; font: 14px Arial; padding-top: 8px; font-weight: bold; color: #4d3807; }
	 .header .veld { float: left; color: #7b7b7b; width: 334px; height: 20px; border: 0px; margin: 0px 10px 0px 10px; padding: 9px; background: url('../images/input-zoeken.gif') no-repeat; position: relative; }
	 .header .button { float: left; }

/* Kruimelpad
 * ---------------------------------------------------------- */
	 .kruimelpad { float: left; width: 1000px; height: 57px; }
	 .kruimelpad ul { margin: 20px 0px 0px 0px; padding: 0px; }
	 .kruimelpad ul li { float: left; list-style: none; margin: 0px; padding: 0px; }
	 .kruimelpad ul li a { color: #989898; text-decoration: underline; margin: 0px; padding-right: 20px; background: url('../images/arrow-kp.gif') top right no-repeat; }
	 .kruimelpad ul li a:hover { text-decoration: none; }
	 .kruimelpad .terug { float: right; }
	 .kruimelpad .link { margin: 0px; padding: 0px 0px 0px 20px; background: url('../images/arrow-terug.gif') top left no-repeat; }
	 .kruimelpad h2 { float: left; display: inline; font: 12px Arial; color: #b41bad; margin: 0px 0px 0px 15px; padding: 0px; }

 /* Intro
 * ---------------------------------------------------------- */
	 .intro { float: left; width: 960px; padding: 8px 20px 12px 20px; background-color: #f9eff9; }
	 .intro p { color: #73156f; line-height: 24px; }
	 .intro a { color: #ff00f3; text-decoration: underline; }
	 .intro a:hover { text-decoration: none; }

/* Archief
 * ---------------------------------------------------------- */
	 .archief { float: left; width: 960px; height: 30px; color: #ffffff; margin: 1px 0px 1px 0px; padding: 13px 20px 0px 20px; background-color: #b41bad; }
	 .archief span { font-weight: bold; color: #ffffff; }
	 .archief a { color: #ffffff; text-decoration: none; padding: 2px 3px 2px 3px; }
	 .archief a:hover { text-decoration: underline; background-color: #680a64; }
	 .archief .selected { text-decoration: underline; background-color: #680a64; }

/* Artiest informatie
 * ---------------------------------------------------------- */
	 .artiestInformatie { float: left; width: 459px; padding: 2px 20px 16px 20px; background-color: #f9eff9; }
	 .artiestInformatie h3 { font: 12px Arial; margin: 0px; padding: 10px 0px 0px 0px; color: #ff00f3; }
	 .artiestInformatie span { float: left; width: 100px;  font-weight: bold; color: #73156f; }

/* SociaMedia
 * ---------------------------------------------------------- */
	 .socialmedia { float: left; width: 501px; height: 107px; text-decoration: none; background: url('../images/mediaBg.gif') no-repeat; }
	 .socialmedia span { float: left; font: 18px Arial; color: #ffffff; font-weight: bold; margin: 10px 0px 0px 20px; }
	 .socialmedia p { float: left; display: block; font: 12px Arial; color: #ffffff; margin: 6px 0px 0px 20px; padding: 0px; }
	 .socialmedia img { float: left; width: 106px; height: 107px; border: 0px; }

/* Pagina navigatie
 * ---------------------------------------------------------- */
	 .paginaNav { float: left; width: 960px; padding: 14px 20px 16px 20px; background-color: #f9eff9; color: #b41bad; }
	 .paginaNav a { font-weight: bold; color: #b41bad; text-decoration: none; padding: 2px 5px 2px 5px; }
	 .paginaNav a:hover { color: #ffffff; text-decoration: underline; background-color: #b41bad; }
	 .paginaNav .selected { color: #ffffff; text-decoration: underline; background-color: #b41bad; }

/* Content
 * ---------------------------------------------------------- */
	 .content { float: left; width: 1000px; padding-bottom: 10px; }
	 .content .ads { text-align: center; margin-top: 20px; }
		.contentSongtekst { float: left; width: 479px; text-align: right; margin: 20px 0px 20px 0px; padding-right: 20px; border-right: 1px solid #fedb89; }
		.contentSongtekst h3 { font: 18px Arial; font-weight: bold; color: #800b7b; margin: 0px 0px 15px 0px; padding: 0px 0px 10px 0px; }
		.contentSongtekst p { color: #5a5a5a; line-height: 24px; }

		.contentVertaling { float: left; width: 480px; text-align: left; margin-top: 20px; padding-left: 20px; }
		.contentVertaling h3 { font: 18px Arial; font-weight: bold; color: #800b7b; margin: 0px; padding: 0px 0px 15px 0px; }
		.contentVertaling p { color: #5a5a5a; line-height: 24px; }
		.contentVertaling .goog-trans-section { display: none; }
		.contentVertaling .goog-trans-control { display: none; }

	 .content .vertaalMachine { float: left; width: 643px; height: 568px; margin-top: 5px; border: 1px solid #e3e3e3; }
	 .content .vertaalMachine form { margin: 0px 0px 0px 15px; padding: 0px; }
	 .content .vertaalMachine fieldset { margin: 0px; padding: 0px; border: 0px; }
	 .content .vertaalMachine label { display: block; font: 18px Arial; font-weight: bold; color: #000000; margin: 15px 0px 10px 0px; }
	 .content .vertaalMachine input { width: 445px; height: 19px; padding: 12px 5px 10px 5px; background-color: #f9eff9; border: 1px solid #b41bad; }
	 .content .vertaalMachine textarea { width: 602px; height: 235px; font: 12px Arial; padding: 10px 5px 10px 5px; background-color: #f9eff9; border: 1px solid #b41bad; }
	 .content .vertaalMachine .button { float: right; width: 138px; height: 61px; margin: 10px 13px 0px 0px; border: 0px; cursor: pointer; background: url('../images/button-vertaal.gif') no-repeat; }
	 .content .vertaalMachine .links { float: left; width: 474px; height: 35px; padding-top: 23px; margin-top: 10px; text-align: center; border: 1px solid #c75d0f; background-color: #fd9038; }
	 .content .vertaalMachine .error { border: 1px red solid; }

	 .overzicht { float: left; width: 1000px; padding-bottom: 10px; }
	 .overzicht .ads { float: left; margin-top: 20px; }
	 .overzicht a { display: block; color: #b41bad; text-decoration: none; padding: 6px 0px 6px 0px; }
	 .overzicht a:hover { text-decoration: underline; font-weight: bold; color: #ff00f3; }
	 .overzicht table { float: right; display: inline; margin: 10px 0px 0px 0px; }
	 .overzicht tr { display: block; }
	 .overzicht td { width: 278px; border-bottom: 1px solid #c3c3c3; }
	 .overzicht td.large { width: 841px; border-bottom: 1px solid #c3c3c3; }

	 .content .reclame { float: right; width: 346px; height: 568px; margin-top: 5px; border: 1px solid #e3e3e3; }

/* Gerelateerde songteksten
 * ---------------------------------------------------------- */
	 .gerelateerdeSongteksten { float: left; width: 662px; margin-top: 8px; }
	 .gerelateerdeSongteksten h2 { width: 642px; height: 29px; font: 12px Arial; color: #ffffff; margin: 0px; padding: 13px 0px 0px 20px; background: #fedb8a url('../images/balk-geel.gif') top left no-repeat; }
	 .gerelateerdeSongteksten ul { margin: 0px; padding: 0px; }
	 .gerelateerdeSongteksten li { list-style: none; border-bottom: 1px solid #e3e2e2; }
	 .gerelateerdeSongteksten .none { border: 0px; }
	 .gerelateerdeSongteksten a { display: block; color: #7b7b7b; margin-left: 20px; padding: 12px 0px 12px 20px; text-decoration: none; background: url('../images/arrow-or.gif') no-repeat; }
	 .gerelateerdeSongteksten a:hover { font-weight: bold; color: #fe6e02; background: url('../images/arrow-or-hover.gif') no-repeat; }

/* Gerelateerde zoekwoorden
 * ---------------------------------------------------------- */
	 .gerelateerdeZoekwoorden { float: left; width: 318px; margin: 8px 0px 0px 20px; }
	 .gerelateerdeZoekwoorden span { display: block; width: 298px; height: 29px; font: 12px Arial; font-weight: bold; color: #ffffff; margin: 0px; padding: 13px 0px 0px 20px; background: #d557d0 url('../images/balk-paars.gif') top left no-repeat; }
	 .gerelateerdeZoekwoorden ul { margin: 0px; padding: 0px; }
	 .gerelateerdeZoekwoorden li { list-style: none; border-bottom: 1px solid #e3e2e2; }
	 .gerelateerdeZoekwoorden .none { border: 0px; }
	 .gerelateerdeZoekwoorden a { display: block; color: #7b7b7b; margin-left: 20px; padding: 12px 0px 12px 20px; text-decoration: none; background: url('../images/arrow-or.gif') no-repeat; }
	 .gerelateerdeZoekwoorden a:hover { font-weight: bold; color: #b41bad; background: url('../images/arrow-or-hover.gif') no-repeat; }

/* Footer
 * ---------------------------------------------------------- */
	 .footer { float: left; width: 1000px; margin-top: 20px; padding: 10px 0px 10px 0px; border-top: 1px solid #c3c3c3; }
	 .footer ul { margin: 0px; padding: 0px; }
	 .footer li { float: left; color: #7b7b7b; list-style: none; margin: 0px 20px 0px 0px; padding: 0px; }
	 .footer a { color: #7b7b7b; margin-right: 20px; text-decoration: underline; }
	 .footer a:hover { text-decoration: none; }
	 .footer .copyright { float: right; }
	 .footer .copyright li { margin: 0px; }
	 .footer .copyright a { margin: 0px; }

/* Popup
 * ---------------------------------------------------------- */
#facebox {

/* overlay is hidden before loading */
display:none;

/* standard decorations */
position: absolute;
top: 50%;
left: 50%;
width:500px;
height:500px;
margin:-250px 0px 0px -250px;
border:10px solid #666;

/* for modern browsers use semi-transparent color on the border. nice! */
border:10px solid rgba(82, 82, 82, 0.698);

/* hot CSS3 features for mozilla and webkit-based browsers (rounded borders) */
-moz-border-radius:8px;
-webkit-border-radius:8px;
}

#facebox div { float:left; width:500px; height:500px; border:1px solid #fff; background-color:#ffffff; font: 12px Arial; }
#facebox .close { position:absolute; width:35px; height:35px; top:-15px; right:-18px; cursor:pointer; text-decoration:none; background: url('../images/popup/faceclose.png') no-repeat; border:0px; }