/* ### general ### */
* { margin: 0px; padding: 0px; }
html, body { font-family: Tahoma, Arial, Helvetica; font-size: 12px; color: #232323; height: 100%; }
input, select, textarea { font-family: Tahoma, Arial, Helvetica; font-size: 12px; color: #232323; }
body { background: #fff url(https://janninkbouw.triplon.io/themes/jannink_2013//images/body_bg.png) repeat-x; }
img { border: 0px; display: block; }
header, footer, nav, section, aside, hgroup, article { display: block; }
a, input { outline: none; }
a { color: #3a3a37; }
a:hover { text-decoration: none; }

/* ### global classes ### */
.clear { clear: both; height: 0; }

/* ### wrapper ### */
#wrapper { position: relative; display: block; width: 100%; min-height: 100%; }

/* ### main container ### */
#mainCntr { margin: 0 auto; width: 910px; padding-bottom: 30px; }

	/* ### header container ### */
	#headerCntr { width: 910px; min-height: 400px; }
	#headerCntr a.logo { float:left; display: block; margin-top: 28px; left: 0px; width: 217px; height: 96px; text-indent: -9999px; background: url(https://janninkbouw.triplon.io/themes/jannink_2013//images/logo.png) no-repeat; }
	
		/* ### menu Box ### */
		.menuBox { height: 30px; float:right; margin-top: 100px;}
		.menuBox ul { display:inline-block; list-style: none; }
		.menuBox li { float:left; margin-left: 30px; text-align: center; }
		.menuBox li a { font-size: 16px; position:relative; bottom:-2px; color:#243c96; text-decoration: none; }
		.menuBox li.home { width: 70px; }
		.menuBox li.profile { width: 80px; }
		.menuBox li.permit { width: 160px; }
		.menuBox li.news { width: 80px; }
		.menuBox li.contact { width: 90px; }
		.menuBox li a:hover, .menuBox li.active a { position:relative; bottom: 2px; font-size: 20px; font-weight: bold; } 
		
		/* ### service Box ### */
		.serviceBox { margin-top: 60px; width: 932px; }
		.serviceBox ul { display:inline-block; list-style: none; }
		.serviceBox li { display:inline-block; width: 250px; height: 130px; background: url(https://janninkbouw.triplon.io/themes/jannink_2013//images/bg1.png) no-repeat; padding: 15px; position: relative; float: left; margin-right: 30px; box-shadow: 0px 0px 5px rgba(0,0,0,0.5); }
		.serviceBox li.last { margin-right: 0px; }
		.serviceBox li h3 { font-size: 18px; color: #FFFFFF; margin-bottom: 10px; }
		.serviceBox li p { font-size: 14px; color: #FFFFFF; }
		.serviceBox li a { color: #1f3380; font-size: 14px; background: #FFFFFF; display: block; position: absolute; bottom: 0px; right: 0px; padding: 7px 10px; text-decoration: none; }
		.serviceBox li a:hover { text-decoration: underline; }

	
	/* ### content container ### */
	#contentCntr { overflow: hidden; width: 910px; }
	#contentCntr p { line-height: 20px; }
	
		/* ### np container ### */
		#npCntr { overflow: hidden; padding-bottom: 10px; }
		#npCntr ul { list-style: none; }
		#npCntr li { font-size: 12px; color: #b2b2b2; margin: 0 2px; float: left; }
		#npCntr li a { color: #b2b2b2; }
		#npCntr li a:hover, #npCntr li.active a { text-decoration: none; } 
		
		/* ### left container ### */
		#leftCntr { float: left; width: 295px; padding-top: 10px; }
		#leftCntr.sub { width: 260px; }
		
		a.grey { color: #1f3380; }
		a.grey:hover { text-decoration: none; }
		
		/* ### left container ### */
		#largeCntr { float: left; width: 600px; padding-top: 10px; }
		#largeCntr.sub { width: 545px; }
		
			/* ### welcome box ### */
			.welcomeBox { width: 250px; }
			#largeCntr .welcomeBox { width: 535px; }
			.welcomeBox h1{ font-size: 25px; }
			.welcomeBox h1 { font-size: 18px; color: #1f3380; margin-bottom: 15px; }
			.welcomeBox h5 { font-size: 15px; color: #000; }
			.welcomeBox p { padding-bottom: 15px; }
			.welcomeBox p span { color: #919191; }
			.welcomeBox a.button { float: right; font-size: 18px; color: #fff; text-decoration: none; padding: 3px 10px; background: #fdbc39; }
			.welcomeBox a.button:hover { color: #1f3380; }
			
			/* ### project box ### */
			.projectBox { width: 250px; }
			#largeCntr .projectBox { width: 535px; }
			.projectBox h1 { font-size: 18px; color: #1f3380; margin-bottom: 15px; }
			.projectBox h5 { font-size: 15px; color: #000; }
			.projectBox p { padding-bottom: 15px; }
			.projectBox p span { color: #919191; }
			.projectBox a.button { float: right; font-size: 18px; color: #fff; text-decoration: none; padding: 3px 10px; background: #fdbc39; }
			.projectBox a.button:hover { color: #1f3380; }
		
		/* ### right container ### */
		#rightCntr { float: right; width: 615px; padding-top: 10px; }
		#rightCntr.sub { width: 595px; }
		
			/* ### photo box ### */
			.photoBox { float: left; width: 304px; padding-left: 6px; }
			.photoBox ul { list-style: none; }
			.photoBox li { margin-bottom: 20px; }
			
			/* ### news box ### */
			.newsBox { float: right; width: 260px; padding-right:14px; }
			.newsBox h3 { font-size: 20px; color: #1f3380; } 
			.newsBox ul { list-style: none; padding-bottom: 15px; }
			.newsBox li { padding: 15px 0; border-bottom: 1px solid #1f3380; }
			.newsBox li strong { display: block; color: #1f3380; }
			.newsBox li a { color: #1f3380; }
			.newsBox li a:hover { text-decoration: none; }
			.newsBox a.all { color: #1f3380; }
			.newsBox a.all:hover { text-decoration: none; }
			
			/* ### gallery box ### */
			.galleryBox { width: 595px; position: relative; }
			.galleryBox .photo { height: 460px; }
			.galleryBox .thumbs { overflow: hidden; position: relative; padding: 0 18px; }
			.galleryBox .thumbs ul { list-style: none; overflow: hidden; }
			.galleryBox .thumbs li { display:none; float: left; margin: 0 9px; }
			.galleryBox .thumbs a.prev { position: absolute; top: 0; left: 0; }
			.galleryBox .thumbs a.next { position: absolute; top: 0; right: 0; }
			.galleryBox a.all { color: #fff; background: #4155a2; line-height: 28px; width: 244px; text-align: center; font-size: 14px; text-decoration: none; float: right; margin-top: 20px; }
			.galleryBox a.all:hover { text-decoration: underline; }
			
			/* ### projects box ### */
			.projectsBox { width: 615px; position: relative; }
			.projectsBox h3 { width: 560px; height: 22px; line-height: 22px; padding: 0 15px; background: #26387f; margin-bottom: 10px; color: #fff; font-weight: normal; }
			.projectsBox ul { list-style: none; overflow: hidden; }
			.projectsBox li { position:relative; float: left; margin: 0 25px 25px 0; }
			.projectsBox li img { width: 180px; height: 134px; }
			.projectsBox h4 { overflow: hidden; padding-bottom: 5px; font-size: 14px; color: #000; }
			.projectsBox h4 span { float: right; font-weight: normal; }
	       
            .serviceBox ul div {
                float: left;
                margin-right: 20px;
                padding: 0px;
            }
            
            .serviceBox ul div li {
                margin-right: 0px;
            }
            
	/* ### footer contrainer ### */
	#footerCntr { overflow: hidden; width: 100%; background: url(https://janninkbouw.triplon.io/themes/jannink_2013//images/footer_bg.png) repeat-x; }
	#footerCntr .inner { width: 910px; height: 190px; margin: 0 auto; padding-top: 50px; }
	
		/* ### call box ### */
		.callBox { float: left; width: 310px; }
		.callBox strong { font-size: 17px; color: #fff; line-height: 30px; }
		.callBox strong span { color: #1f3380; background: #fff; padding: 0 10px; margin-left: 5px; }
		
		/* ### contact box ### */
		.contactBox { float: left; width: 300px; }
		.contactBox address { color: #fff; font-style: normal; display: block; width: 300px; }
		.contactBox address span { width: 20px; float: left; }
		.contactBox address a { color: #fff; }
		.contactBox address a:hover { text-decoration: none; }
		
		/* ### links box ### */
		.linksBox { float: left; width: 300px; }
		.linksBox ul.links { float: left; width: 150px; list-style: none; }
		.linksBox ul.links li a { color: #fff; }
		.linksBox ul.links li a:hover { text-decoration: none; }
		.linksBox ul.logos { list-style: none; overflow: hidden; padding-top: 25px; }
		.linksBox ul.logos li { float: left; margin-right: 20px; }
		
#contact_form input { float:right; margin-top:10px; width: 160px; }
#contact_form .form_label { display:inline-block; padding-bottom: 10px; padding-top:10px; }
#contact_form textarea { float:right; width: 160px; height: 100px; margin-top:10px; }
#contact_form input[name=submit] { float:right; margin-top:10px; width: 80px; margin-right: 80px; }