@charset "utf-8";

/*	PROJECTNAAM STYLES
	Author:	Stephan van Opstal, Netvlies
	----------------------------------------------------*/

/*	=RESETS
	----------------------------------------------------*/
	* { margin: 0; padding: 0; outline: 0; font-family: Arial, Helvetica, sans-serif; }
	img { border: 0; vertical-align: bottom; }
	
/*	=FIXES
	----------------------------------------------------*/
	.clr { overflow: hidden; height: 100%; }
	
/*	=WRAPPERS
	----------------------------------------------------*/
	#page-wrapper { width: 979px; margin: 0 auto; padding: 30px 0 0 0; }
	#col-a { float: left; width: 735px; }
	#col-b { float: right; width: 244px; padding: 0; }
	#content-footer { width: 717px; height: 143px; background: url(../img/content-footer_bg.gif) no-repeat top left; font-size: 0; line-height: 0; }
	
	.block { background: url(../img/block_bg.gif) repeat-y top left; }
	.block .wrapper { position: relative; width: 100%; background: url(../img/block_wrapper_bg.gif) repeat-y top right; }
	.block .outer { margin: 0 9px 0 9px; background: url(../img/block_outer_bg.gif) repeat-x top left; }
	.block .inner { padding: 3px 0 11px 0; background: url(../img/block_inner_bg.gif) repeat-x bottom left; }
	.tr { position: absolute; top: 0; right: 0; width: 24px; height: 18px; background: url(../img/block_tr_bg.gif) no-repeat; font-size: 0; line-height: 0; }
	.br { position: absolute; bottom: 0; right: 0; width: 24px; height: 26px; background: url(../img/block_br_bg.gif) no-repeat top left; font-size: 0; line-height: 0; }
	.bl { position: absolute; bottom: 0; left: 0; width: 24px; height: 26px; background: url(../img/block_bl_bg.gif) no-repeat top left; font-size: 0; line-height: 0; }
	.tl { position: absolute; top: 0; left: 0; width: 23px; height: 18px; background: url(../img/block_tl_bg.gif) no-repeat top left; font-size: 0; line-height: 0; }
	
	#content { width: 735px; }
	#movie-posters { width: 244px; }
	#cta { width: 244px; }
	#frame { padding: 20px; }
	
	#process-error span { background: #ff0000; color: #fff; font-size: 12px; font-weight: bold; }
	
/*	=TYPOGRAPHY
	----------------------------------------------------*/
	h1 { margin: 0 0 10px 0; padding: 0 0 5px 0; font-size: 16px; border-bottom: 1px solid #ebebeb; }
	h2 { margin: 10px 0 10px 0; font-size: 14px; }
	h2 span { color: #c8c8c8; }
	
/*	=NAVIGATION
	----------------------------------------------------*/
	#nav-main { width: 735px; height: 40px; list-style: none; }
	#nav-main li { float: left; padding: 5px 10px 5px 25px; font-size: 18px; line-height: 28px; color: #009ee0; font-weight: bold; }
	#nav-main li a { color: #009ee0; text-decoration: none; }
	#nav-main li.active a { color: #000; }
	#nav-main li a:hover { text-decoration: underline; }
	
	#nav-meta { clear: both; width: 735px; list-style: none; }
	#nav-meta li { float: left; padding: 0px 25px; font-size: 14px; line-height: 28px; color: #a7a7a7; font-weight: bold; }
	#nav-meta li a { color: #a7a7a7; text-decoration: none; }
	
	#nav-process { height: 25px; margin: 0 0 15px 0; list-style: none;  }
	#nav-process li { float: left; width: 168px; height: 18px; padding: 0 0 10px 0; background: url(../img/nav-process_bg.gif) repeat-x bottom left; font-size: 14px; font-weight: bold; color: #cfcfd1; }
	#nav-process li a { color: #cfcfd1; text-decoration: none;  }
	#nav-process li.active { color: #000; background: url(../img/nav-process_bg_active.gif) repeat-x bottom left; }
	#nav-process li.done { background: url(../img/nav-process_bg_active.gif) repeat-x bottom left; }
	
	#nav-submit { list-style: none; }
	#nav-submit li { clear: both; line-height: 14px; font-size: 14px; font-weight: bold; text-align: right; }
	#nav-submit li a { color: #ff0000; text-decoration: none; line-height: 14px; }
	#nav-submit li a.submit { color: #009ee0; }

/*	=PRODUCTS FORM
	----------------------------------------------------*/
	#frm-products { position: relative; margin: 15px 0 0 0; }
	#frm-products ol { width: 490px; list-style: none; }
	#frm-products ol li { float: left; padding: 0 20px 30px 0; }
	#frm-products ol li img { display: block; margin: 0 0 10px 0; }
	#frm-products select { width: 140px; }
	#frm-products .blik { position: absolute; top: 0; left: 490px; }
	#frm-products .blik .vsl-blik { display: block; margin: 0 0 5px 0; }
	#frm-products .blik .info { margin: 0 0 0 10px; }
	#frm-products .blik label { padding: 0 0 2px 0; font-size: 12px; }
	#frm-products .blik label input { position: relative; top: 2px; float: left;  width: 13px; height: 13px; margin: 0 5px 0 0; vertical-align: middle; }
	#frm-products .blik #lblboninblik { display: inline; float: left; padding: 0; line-height: 18px;}

/*	=DETAILS FORM
	----------------------------------------------------*/
	#frm-details { position: relative;  }
	#frm-details h6 { margin: 0 0 10px 0; font-size: 12px; font-weight: normal; }
	#frm-details ol { list-style: none; }
	#frm-details ol li { position: relative; overflow: hidden; width: 450px; padding: 5px 0; border-top: 1px solid #ebebeb;  }
	#frm-details ol li p { float: left; width: 170px; margin: 3px 0 0 0; font-size: 12px; }
	#frm-details ol li p span { float: left; width: 150px; }
	#frm-details ol li p.orderinfo { float: none; width: 100%; }
	#frm-details ol li .inpt { width: 250px; padding: 2px; border: 1px solid #d5d5cb; font-size: 12px; }
	#frm-details ol li .inpt.name { width: 195px; }
	#frm-details ol li .zipcode { width: 80px; }
	#frm-details ol li .house { width: 40px; }
	#frm-details ol li textarea { overflow: auto; width: 250px; padding: 2px; border: 1px solid #d5d5cb; font-size: 12px; }
	#frm-details ol li label { display: block; padding: 2px 0 2px 0; font-size: 12px; }
	#frm-details ol li label input { position: relative; top: -1px;  width: 13px; height: 13px; margin: 0 5px 0 0; vertical-align: bottom; }
	#frm-details ol li label img { position: absolute; top: 3px; left: 320px; }
	#frm-details .caption { float: left; width: 250px; margin: 5px 0 0 170px; font-size: 10px; }
	#frm-details .caption.error { color: #ff0000; }
	#frm-details #biobanner { position: absolute; top: 26px; left: 480px; border: 1px solid #d5d5cb; }
	
	#frm-details .divider { clear: both; padding: 5px 0; }
	
	#different-delivery-address { margin: 10px 0 0 0; }
	.zipcode-caption { display: none; padding: 0 0 5px 0; }
	
	#personal-message-box { margin: 5px 0 0 0; padding: 5px 0 0 0; border-top: 1px solid #ebebeb; }
	#personal-message-box p { float: none!important; display: block; width: 400px!important; }
	#personal-message-box textarea { margin: 10px 0 0 0; width: 400px!important; }
	#personal-message-box .caption { margin-left: 0; }
	#personal-message-box ul { clear: both; margin: 10px 0 0 0;  }
	#personal-message-box ul li { float: left; width:160px; border: 0; padding: 0; }
	#personal-message-box ul li input { position: relative; top: 1px; margin: 0 3px 0 0; }
	#personal-message-box ul li label { display: inline; }
	#personal-message-box ul li img { position: relative!important; top: 0!important; left: 0!important; clear:both; display: block; margin: 5px 0 0 0; }

/*	=PAYMENT FORM
	----------------------------------------------------*/
	#frm-payment ol { margin: 10px 0 0 0; list-style: none; }
	#frm-payment ol li { height: 18px; padding: 6px 0 6px 0; background: #fff; line-height: 14px; }
	#frm-payment ol li label { width: 100%; font-size: 12px; }
	#frm-payment ol li label input { position: relative; top: -1px; width: 13px; height: 13px; margin: 0 5px 0 0; vertical-align: bottom; }
	#frm-payment ol li.ideal { background: url(../img/ico_ideal.gif) no-repeat 25px center; }
	#frm-payment ol li.ideal input { margin: 0 45px 0 0; }
	#frm-payment ol li.idealbank { padding: 0 0 0 25px; }
	#frm-payment ol li.idealbank.show { display: block; }
	#frm-payment span.error { background: #ff0000; color: #fff; font-weight: bold; }
	
/*	=ORDER OVERVIEW
	----------------------------------------------------*/
	#frm-overview ol { list-style: none; }
	#frm-overview ol li { padding: 8px 0;  font-size: 12px; border-top: 1px solid #ebebeb;}
	#frm-overview ol li ul { padding: 0 0 5px 0; list-style: none; }
	#frm-overview ol li ul li { float: left; padding: 5px 20px 0 0!important; border: 0; font-size: 16px; font-weight: bold; }
	#frm-overview ol li ul li * { vertical-align: middle; }
	#frm-overview ol li .address { float: left; margin: 0 20px 0 0; }
	#frm-overview ol li .address span { font-weight: bold; }
	#frm-overview ol li.total { font-size: 14px; font-weight: bold; }
	#frm-overview ol li.bio { height: 16px; padding-left: 45px; background: url(../img/ico_bio.gif) no-repeat center left; }
	#frm-overview ol li.ideal { height: 16px; padding-left: 45px; background: url(../img/ico_ideal.gif) no-repeat center left; }
	#frm-overview span.error { font-size: 12px; background: #ff0000; color: #fff; font-weight: bold; }
	
/*	=CONTACT FORM
	----------------------------------------------------*/
	#frm-contact { margin: 10px 0 0 0; }
	#frm-contact ol { list-style: none; }
	#frm-contact ol li { overflow: hidden; height: 100%; padding: 5px 0; border-bottom: 1px solid #ebebeb; }
	#frm-contact ol li p { float: left; width: 170px; margin: 3px 0 0 0; font-size: 12px; }
	#frm-contact ol li p span { float: left; width: 150px; }
	#frm-contact ol li .inpt { width: 300px; padding: 2px; border: 1px solid #d5d5cb; font-size: 12px; }
	#frm-contact ol li textarea { overflow: auto; width: 300px; padding: 2px; border: 1px solid #d5d5cb; font-size: 12px; }
	#frm-contact .caption { float: left; margin: 5px 0 0 170px; font-size: 10px; }
	#frm-contact .caption.error { color: #ff0000; }
	
/*	=POSTER CAROUSEL
	----------------------------------------------------*/
	#movie-poster .carousel li { height: 350px; }
	#movie-poster .bot { display: none; position: absolute; bottom: 11px; left: 9px; z-index: 100; width: 226px; height: 50px; background: url(../img/movie-poster_bot_bg.png) no-repeat; }
	
	.jcarousel-skin-nvb .jcarousel-next { position: absolute; top: 315px; left: 195px; z-index: 200; width: 26px; height: 26px; cursor: pointer; xbackground: red; }
	.jcarousel-skin-nvb .jcarousel-prev { position: absolute; top: 315px; left: 25px; z-index: 200; width: 26px; height: 26px; cursor: pointer; xbackground: red;  }
	.jcarousel-skin-nvb .jcarousel-container-horizontal { width: 226px; }
	.jcarousel-skin-nvb .jcarousel-clip-horizontal { width:  226px; }
	
	#blik-info { position: absolute; top: 0; left: 0; z-index: 999; width: 150px; padding: 10px; background: #fff; border: 1px solid #c3c3c3; font-size: 12px; color: #6e6e6e; }