@charset "utf-8";

/*	SCHOOLPAS STYLES
	Author:	Sebastiaan Smid, Netvlies
			
	----------------------------------------------------*/

/*	Table of contents
	= GENERIC
	= BRANDING
	= NAV MAIN
	= NAV META
	= CRUMPATH
	= HOME NEWS ITEM
	= CALL TO ACTION
 	----------------------------------------------------*/

/*	= GENERIC
	----------------------------------------------------*/
	* { margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #000; }
	img, fieldset { border: 0; }
	a { outline: 0; }
	body { background: #fff; text-align: center; padding-bottom: 50px; }
	h5 { background: #efeae2; padding: 5px; }
	
	#page-box { position: relative; padding-top: 191px; width: 930px; margin: 0 auto; text-align: left; }
	#page-box, #nav-meta, #home-news-items, #home-cta, #col-a, #col-b  { overflow: hidden; height: 100%; }
	#col-a { width: 327px; float: left; }
	#col-b { width: 585px; float: left; padding-bottom: 15px; }
	#col-b h1 { color: #c20526; font-size: 14px; margin: 12px 0 10px 0; }
	#col-b h1 a { font-weight: normal; font-size: 12px; margin: 0 0 0 10px; padding: 0 0 0 12px; background: url(../img/h1_ico.gif) no-repeat left center; }
/*	= LOGIN
	----------------------------------------------------*/
	#login { width: 100%;  padding: 7px 0; background: #efeae2 url(../img/form-login_bg.gif) repeat-x bottom;  }
	#login fieldset { position: relative; width: 930px; margin: 0 auto;  text-align: right;	} 
	#login input { border: 1px solid #c5c5c5; padding: 3px 5px; margin-left: 7px; vertical-align: middle; }
	#login input.btn { width: auto; overflow: visible; cursor: pointer; border:none; background: #193e58; color: #fff; margin-right: 15px; font-weight: bold; }
	#login label { margin-left: 15px; }
	#login #mijn-materialen { position: absolute; top: -7px; left: 0; height: 19px; padding: 5px; text-align: left; background: url(../img/mijn_materialen_bg.gif) repeat-x; }
	
/*	= BRANDING
	----------------------------------------------------*/
	#branding-logo { position: absolute; top: 21px; left: 16px; }
	#branding-payoff { position: absolute; top: 48px; left: 176px;  }

/*	= NAV MAIN
	----------------------------------------------------*/
	#nav-main { position: absolute; top: 96px; left: 178px; height: 56px; padding-left: 10px; background: url(../img/nav-main_bg.gif) no-repeat; }
	#nav-main * { color: #193e58; font-size: 14px; font-weight: bold; text-transform: uppercase;  }
	#nav-main li { float: left; margin: 21px 30px 0 0; list-style: none; }
	#nav-main a { text-decoration: none; }
	#nav-main a:hover { text-decoration: underline; }
	#nav-main li.selected a { text-decoration: underline; }

/*	= NAV SUB
	----------------------------------------------------*/	
	#nav-sub { width: 281px; margin: 0 14px 25px 15px;  }
	#nav-sub h1, #nav-sub h1 * { height: 19px; background: #efeae2; color: #56a1d5; font-size: 16px; line-height: 20px; overflow: hidden; padding: 6px 9px 4px 9px;  }
	#nav-sub li { list-style: none; padding: 0px; vertical-align: bottom; border-top: 1px solid #efeae2; background: #f7f4ef url(../img/li_bg.gif) no-repeat 9px 17px;}
	#nav-sub li a {height:100%;	padding: 10px 0 10px 20px; display: block; color: #193e58; text-decoration: none; font-weight: bold;  }
	#nav-sub li ul { background: #efeae2; padding-left: 15px; }
	#nav-sub li li { padding: 0px; background: #efeae2 url(../img/li_li_bg.gif) no-repeat 9px 17px; }
	#nav-sub li.last { padding: 10px 0 10px 9px; background: #efeae2; background-image: none; }
	#nav-sub li.last a { display: inline; padding: 0; font-weight: normal;font-size: 10px;  }
	#nav-sub li.last #print { display: none; margin-right: 20px; background: url(../img/nav-sub_ico_print.gif) no-repeat left center !important; }
	#nav-sub li.last #mail { background: url(../img/nav-sub_ico_mail.gif) no-repeat left center !important; }
	#nav-sub li.last #print, #nav-sub li.last #mail { padding: 0 0 0 19px; }

/*	= NAV META
	----------------------------------------------------*/
	#nav-meta  { background: url(../img/divider.gif) repeat-x top center; clear: both; margin: 16px 0 0 15px; padding: 10px 0 0 0;  }
	#nav-meta li { float: left; padding-left: 18px; list-style: none; background: url(../img/nav-meta_divider.gif) no-repeat 8px; }
	#nav-meta li.first { padding: 0; background: none; }
	
/*	= CRUMPATH
	----------------------------------------------------*/
	#crumpath { height: 100%; overflow: hidden; }
	#crumpath * { font-size: 10px; }
	#crumpath li { float: left; list-style: none; }
	
/*	= HOME NEWS ITEM
	----------------------------------------------------*/
	#home-news-items { position: relative; background: url(../img/divider.gif) repeat-x bottom center; padding-bottom: 40px; }
	.home-news-item { margin: 0 14px 0 15px; width: 281px; float: left; display: inline; }
	.home-news-item h1, .home-news-item h1 * { color: #c20526; font-size: 14px; text-decoration: none; }
	.home-news-item h1 { height: 16px; overflow: hidden; margin-bottom: 13px; }
	.home-news-item div { width: 281px; height: 75px; line-height: 15px; overflow: hidden; }
	.home-news-item div img { float: left; margin-right: 9px; }
	.home-news-item a.readmore { position: absolute; bottom: 12px; font-weight: bold; }
	
	.news-item { overflow: hidden; height: 100%; padding-bottom: 10px; }
	.news-item img { float: left; margin-right: 10px; }
	.news-item .readmore { display: block; float: left; margin-top: 12px; }
	
	
/*	= SIGNUP 
	----------------------------------------------------*/
	#frm-signup h2 { margin: 15px 0 10px 0; color: #c20526; font-size: 12px; }
	#frm-signup li { list-style: none; }
	#frm-signup li.newsletter { margin-top: 5px; }
	#frm-signup img { position: relative; top: 1px; }
	#frm-signup input.txt { width: 200px; border: 1px solid #c5c5c5; padding: 2px 5px; margin: 2px 0 3px 0; }
	#frm-signup input.txt_small { width: 29px; border: 1px solid #c5c5c5; padding: 2px 5px; margin: 2px 0 3px 0; }
	#frm-signup input.radio { vertical-align: middle; margin: 0 5px 0 15px; }
	#frm-signup input.btn { border:none; padding: 3px 5px; background: #193e58; color: #fff; margin-top: 15px; }
	#frm-signup label { display: block; float: left; width: 150px; margin: 5px 0 0 0; }
	#frm-signup label.radio { display: inline; float: none; }

	#frm-signup li.error input.txt { border-color: #c20526; }
	#frm-signup li.error label { color: #c20526; }

/*	= SEND TO A FRIEND
	----------------------------------------------------*/
	#frm-staf li { list-style: none; }
	#frm-staf li.newsletter { margin-top: 5px; }
	#frm-staf img { position: relative; top: 1px; }
	#frm-staf input.txt { width: 200px; border: 1px solid #c5c5c5; padding: 2px 5px; margin: 2px 0 3px 0; }
	#frm-staf input.radio { vertical-align: middle; margin: 0 5px 0 15px; }
	#frm-staf input.btn { border:none; padding: 3px 5px; background: #193e58; color: #fff; margin-top: 15px; }
	#frm-staf label { display: block; float: left; width: 105px; margin: 5px 0 0 0; }
	#frm-staf label.radio { display: inline; float: none; }

	#frm-signup li.error input.txt { border-color: #c20526; }
	#frm-signup li.error label { color: #c20526; }

/*	= ORDER FORMS
	----------------------------------------------------*/
	#order #tabs { overflow: hidden; height: 100%; }
	#order #tabs a { float: left; padding: 0 4px; margin-right: 3px; line-height: 28px; color: #a7a39e; font-weight: bold; text-decoration: none; background: #efeae2; }
	#order #tabs a.selected { background: #f7f4ef; color: #000000; }
	
	#order-crumpath { line-height: 39px; padding: 0 8px; font-weight: bold; color: #ecb3bd; background: #fff; }
	#order-crumpath span { color: #c10424; }
	
	#order .content { background: #f7f4ef; padding: 14px 2px 0 2px; }
	
	#order form .user-content { background: #fff; padding: 5px 8px 13px 8px; overflow: hidden; }
	#order form .buttons { padding: 10px 8px; font-size: 14px; color: #193e58; font-weight: bold; line-height: 41px; }
	#order form .buttons strong { font-size: 14px; color: #c10424; padding: 0 10px; }
	#order form input.txt { width: 95px; border: 1px solid #c5c5c5; padding: 3px 5px; }
	#order form input.btn { border:none; padding: 3px 5px; background: #193e58; color: #fff; vertical-align: middle; }
	#order form input.btn.add { margin-left: 10px; }
	#order form select { border: 1px solid #c5c5c5; width: 125px; padding: 3px 5px; margin: 0 10px; }
	#order form fieldset { background: #fff url(../img/hr_2.gif) no-repeat left top; padding: 15px 8px 13px 8px; }
	#order form fieldset label { line-height: 21px; display: block; float: left; width: 150px; padding-right: 10px; text-align: right; }
	#order form fieldset span.remove { float: right; }
	#order form fieldset p.order-info { margin-top: 8px; }
	#order form fieldset p.order-item { color: #c10424; }
	#order form fieldset p.order-item strong { color: #000; }
	
	#order #step2 input.txt { width: 175px !important; vertical-align: middle; }
	#order #step3 .user-content p { margin: 4px 0 !important; }
	#order #step3 .order-item { margin-top: 15px; }
	#order #step3 h4 { color: #c10424; }
	
	#order #preselect { background: #f7f4ef; padding: 0 8px 12px 8px;   } 
	#order #preselect input, #order #preselect select { vertical-align: middle; }
	#order #preselect select { margin: 0 20px 0 10px; }
	
	#order #plain label { width: 160px; }
	#order #plain select {  margin: 0;} 
	#order #plain input.txt { width: 185px; }
	#order #plain .small { width: 55px !important; }
	#order #plain select.small  { width: 65px !important; }

/*	= FAQ
	----------------------------------------------------*/
	#frm-faq { background: #efeae2; padding: 2px 3px; }
	#frm-faq input { border: 1px solid #c5c5c5; padding: 3px 5px; margin-left: 7px; vertical-align: middle; }
	#frm-faq select { border: 1px solid #c5c5c5; width: 185px; padding: 2px; margin-left: 7px; vertical-align: middle; }
	#frm-faq input.btn { border:none; background: #193e58; color: #fff; margin-right: 15px; }
	
	#questions { height: 100%; overflow: hidden; background: #f7f4ef; padding: 10px 0; }
	#questions li { list-style: none; padding: 2px 0 2px 18px; background: url(../img/li_bg.gif) no-repeat 8px 10px;  float: left; width: 260px; }
	
	#faq-answers .answer  { padding: 0 0 25px 0; }
	#faq-answers .answer.first { background: url(../img/hr.gif) no-repeat left top; margin-top: 15px; padding-top: 15px; }
	#faq-answers .answer h2 { position: relative; color: #c20526; font-size: 12px; padding-right: 60px; }
	#faq-answers .answer h2 span { position: absolute; right: 0px; top: 0px; }
	#faq-answers .answer h2 span a { color: #c20526; font-size: 10px; text-decoration: underline; }
	#faq-answers .answer h2 span a:hover { text-decoration: underline; }

/*	= BRANCHES
	----------------------------------------------------*/
	#frm-branch { background: #efeae2; padding: 8px 3px; margin-bottom: 10px; }
	#frm-branch input { border: 1px solid #c5c5c5; padding: 3px 5px; margin-left: 7px; vertical-align: middle; }
	#frm-branch select { border: 1px solid #c5c5c5; width: 185px; padding: 2px; margin-left: 7px; vertical-align: middle; }
	#frm-branch input.btn { border:none; background: #193e58; color: #fff; margin-right: 15px; }
	
	#map { position: relative; height: 217px;}
	#map div { float: left; padding: 2px; border: 1px solid #d1d1d1; }
	#map #help { float: right; position: relative; height: 207px; width: 127px; border-color: #f7f4ef; background-color: #f7f4ef; }
	#map #help.user-content h2 { margin-top: 0 !important; }
	
	#map .pop { position: absolute; top: 0px; left: 0px; width: 10px; height: 10px; border: 1px solid #ff0000; }
	.maplocpos { display: none; }

	#popup { position: absolute; display: none; }
	#popup iframe { display:none; position: absolute; opacity: 0; -moz-opacity: 0; border: none; }
	#popup table { position: relative; border-spacing: 0; border-collapse: collapse; border: 0; }
	#popup td { white-space: nowrap; vertical-align: top; padding: 0; margin: 0; }
	#popup td.t, #popup td.m, #popup td.tr  { background: #c41230; }
	#popup td.m { color: #fff; padding-right: 8px; }
	#popup td.m a { color: #fff; }
	#popup td.bl, #popup td.tl  { width: 11px; }
	#popup td.br, #popup td.tr { text-align: right; width: 24px !important; }
	#popup td.bm { background: url(../img/pop-up_bottom-mid.png); }
	#popup td.l { width: 11px; background: url(../img/pop-up_left.png); }

/*	= BRANCH
	----------------------------------------------------*/
	#branch { background: #efeae2; padding: 5px; overflow: hidden; height: 100%; }
	#branch * { line-height: 15px;}
	#branch img { float: left; margin: 0 13px 0 0;  }	
	#branch h3 { padding: 0; color: #c20526; font-size: 12px; font-weight: bold; }
	
	#branch .info { float: left; width: 330px; }
	#branch ul { list-style: none; }
	#branch ul li { padding: 0 0 0 25px; }
	#branch ul li.tel { background: url(../img/branch_tel_ico.gif) no-repeat 0 1px; }
	#branch ul li.mail { background:url(../img/branch_mail_ico.gif) no-repeat 0 1px; }
	#branch ul li.contactpersoon { background:url(../img/branch_contactpersoon_ico.gif) no-repeat 0 1px; }
	#branch ul li.open { margin: 10px 0 0 0; background:url(../img/branch_time_ico.gif) no-repeat 0 1px; }
	
	#branch-visuals { width: 218px; height: 187px; overflow:hidden; float: left; margin: 0 13px 0 0; }
	#branch-visuals img { margin:0; padding: 0;  display: block; float: left; }
	#branch-visuals img.center { border-left: 1px solid #fff; border-right: 1px solid #fff; }
	#branch-visuals img.full { border-bottom: 1px solid #fff; }
	
	#branchinfo { overflow: hidden; height: 100%; padding-bottom: 15px; background: url(../img/hr.gif) no-repeat bottom; }
	#branchinfo li { float: left; width: 195px; list-style: none; line-height: 20px; } 	
	#branchinfo li a { text-decoration: none; padding: 2px 0 2px 30px; }
	#branchinfo li.expo a { background:url(../img/branch-info_ico_expo.gif) no-repeat left center; }
	#branchinfo li.hoofd a { background:url(../img/branch-info_ico_hoofd.gif) no-repeat left center; }
	#branchinfo li.inburg a { background:url(../img/branch-info_ico_inbur.gif) no-repeat left center; }
	#branchinfo li.iris a { background:url(../img/branch-info_ico_iris.gif) no-repeat left center; }
	#branchinfo li.lokalelinks a { background:url(../img/branch-info_ico_links.gif) no-repeat left center; }
	#branchinfo li.neven a { background:url(../img/branch-info_ico_neven.gif) no-repeat left center; }
	#branchinfo li.rap a { background:url(../img/branch-info_ico_rap.gif) no-repeat left center; }
	#branchinfo li.route a { background:url(../img/branch-info_ico_route.gif) no-repeat left center; }
	#branchinfo li.serv a { background:url(../img/branch-info_ico_serv.gif) no-repeat left center; }
	#branchinfo li.thea a { background:url(../img/branch-info_ico_thea.gif) no-repeat left center; }
	#branchinfo li.vvv a { background:url(../img/branch-info_ico_vvv.gif) no-repeat left center; }
	#branchinfo li.bussen a { background:url(../img/branch-info_ico_bussen.gif) no-repeat left center; }
	#branchinfo li.werkzat a { background:url(../img/branch-info_ico_werkzat.gif) no-repeat left center; }
	
	.hr { width: 100%; background: url(../img/hr.gif) repeat-y left top; font-size: 0; line-height: 0; height:4px; margin: 10px 0; clear: both; }
	h1.sub { font-size: 14px; margin-bottom: 0 !important; }	
	.branch-agenda-item, .branch-news-item { overflow: hidden; height: 100%;  background: url(../img/hr.gif) no-repeat bottom; padding: 10px 0 15px 0; }
	.branch-agenda-item h1, .branch-news-item h1 { font-size: 12px !important; margin-top: 0px !important;  }
	.branch-agenda-item img, .branch-news-item img { float: left; margin-right: 10px; }
	.branch-agenda-item .readmore, .branch-news-item .readmore { display: block; float: left; margin-top: 12px; color: #c10424; }
	
/*	= WEBLINKS
	----------------------------------------------------*/
	#weblink-categories { height: 100%; overflow: hidden; background: #f7f4ef; padding: 10px 0; margin-bottom: 20px; }
	#weblink-categories li { list-style: none; padding: 2px 0 2px 18px; background: url(../img/li_bg.gif) no-repeat 8px 10px;  float: left; width: 270px; }
	#weblink-categories li.selected { font-weight: bold; }
	
	.weblinks { overflow: hidden; height: 100%;}
	/*.weblinks.first { background: url(../img/hr.gif) no-repeat left top; padding: 10px 0 0 0; }*/
	.weblinks .link { width: 270px; float: left; padding: 0 0 0 18px; margin: 10px 0; }
	.weblinks .link h2 a { color: #c20526; text-decoration: none; } 
	.weblinks .link div { padding: 7px 0; }
	
/*	= CALL TO ACTION
	----------------------------------------------------*/
	.cta { position: relative; margin: 0 14px 0 15px; width: 281px; float: left; display: inline; background: #efeae2; }
	.cta h1, .cta h1 * { color: #56a1d5; font-size: 16px; text-decoration: none; }
	.cta h1 { height: 19px; line-height: 20px; overflow: hidden; padding: 6px 9px 4px 9px; }
	.cta div.content-box { overflow: hidden; height: 130px; margin: 2px; clear: both; background: #fff;  }
	.cta div.content-box div { margin: 6px 8px; height: 90px; width: 261px; overflow: hidden; line-height: 15px; }
	.cta a.readmore { position: absolute; bottom: 15px; left: 10px; font-weight: bold; }
	#home-cta { padding: 13px 0 0 0; }
	#col-a .cta { margin-bottom: 25px; float: none; display: block; overflow: hidden; height: 100%; }
	
/*	= SITEMAP
	----------------------------------------------------*/
	#sitemap { }
	#sitemap li { padding-bottom: 20px; line-height: 18px; }
	#sitemap li ul { padding-top: 20px; }
	#sitemap li a { color: #c20526; font-weight: bold; }
	#sitemap li li { background: url(../img/li_bg.gif) no-repeat 0px 7px; margin: 0; padding: 0 0 0 10px; }
	#sitemap li li a { color: #000; font-weight: normal; }