/* responsive voor kleinere beeldchermen */
@media (max-width:960px) {
	.FooterSliderImage {
		width:960px;
		height:600px;
		background-position:top left; /*voor als hij kwa hoogte alsnog mee moet*/
		background-size:100% auto;    /*voor als hij kwa hoogte alsnog mee moet*/
	}
	.caroufredsel_wrapper {height:350px!important;}
	.outer_image_carousel {height:auto!important;}
}

@media (max-width: 700px) {
	#cbGrafiek {width:auto;}
	.caroufredsel_wrapper {height:300px!important;}
	.menu{display:none;}
	.OuterTalenBlock{float:left; padding-top:5px; padding-left:5px;}
	.title{position:absolute; top:20px; left:5px;}
	.header{height:100px;}

	.footer{background-color:#808080;}
	.footerHeader, .left_footer{display:none;}
	.right_footer{width:100%; text-align:center; color:#fff!important;}
	.footer_text_1, .footer_text_1 a{color:#fff;}

	div.miniMenu{display:block;}
	.divImage{height:350px!important;}

	.bannerTekst p {font-size:20px; line-height:30px;}
	.bannerTekst h2 {font-size:30px; line-height:30px;}
	.bannerButton{top:180px; width:60px; height:60px;  border:solid 2px #fff; padding:0px; font-size:0px;}
	.bannerButton a{font-size:15px; line-height:20px; top:8px;}
	.carousel-inner > .item > .divImage > .knop, .carousel-inner > .item > a > .divImage > .knop{width:60px;}


	.belMij { position: fixed;bottom: 0px;right: 0px; width: 150px; height: 180px; z-index: 9999;}
	.belMij .belMijContent { position: absolute; left: 0px; bottom: 10px; height: 150px; width: 150px;border-radius: 100px; padding: 12px 10px; text-align: center; background-size:cover;}
	.belMij .belMijKruisje { position: absolute; right: 10px; top: 10px; height: 35px; width: 35px; background-color: #7b189b; border-radius: 50px; cursor: pointer;}
	.belMij .belMijKruisje .belmijBar { background-color: #fff; height: 2px; width: 75%; display: block;}
	.belMij .belMijKruisje span:nth-child(1) {transform: rotate(45deg); margin-top: 16px; margin-left: 5px;}
	.belMij .belMijKruisje span:nth-child(2) {transform: rotate(-45deg);margin-top: -2px;margin-left: 5px;}
	.belMij .belMijContent p {font-size: 20px; color: #7b189b!important; font-weight: 400; padding-bottom: 0px;}
	.belMij .belMijContent input {font-size: 14px;font-weight: 100; color: #000; text-align: center; background-color: rgba(123,24,155,0.2); margin-bottom: 3px; width: 100px;}
	.belMij .buttonStylePaars {border: 1px solid #7b189b; border-radius: 100px; display: inline-block; width: 35px; height: 35px; font-size: 10px; line-height: 16px; padding-top: 10px; text-transform: uppercase; font-weight: 600; color: #7b189b!important; cursor: pointer;}

	.telefoonIcon {position: fixed; bottom: 0px; right: 0px; width: 60px; height: 60px; z-index: 9999;}

	.telefoonIcon .belMijKruisje {position: absolute;right: 10px; bottom: 10px; height: 35px; width: 35px; background-color: #7b189b; border-radius: 50px; cursor: pointer; background-image: url(../images/tel.png); background-size: 25px; background-position: 5px 5px; background-repeat: no-repeat;}
}

@media all and (max-width:640px) {
	.table {table-layout:fixed;}
	.footer{background-color:#808080;}
	.footerHeader, .left_footer{display:none;}
	.right_footer{width:100%; text-align:center; color:#fff!important;}
	.footer_text_1, .footer_text_1 a{color:#fff;}

	.referenties, .product_referentie {display:none;}   
	.caroufredsel_wrapper {height:240px!important;}    
	.main table tbody td, .Main table tbody td {
		display:block;
		/*padding:0px;*/
		padding-left:5px!important;       
		width:95%;
	}
	.ContactTable td {display:table-cell!important;}
	.ContactTable1 td{display:table-cell!important;}
	.ContactTable2 td{display:table-cell!important;}
	.ContactTable3 td{display:table-cell!important;}

	.Producten a > div {
		padding-left:15px!important;
		padding-right:0px!important;
	}
	.Mockups >li {padding-left:0px;}
	.FooterSliderImage {
		display:block;
		float:left;    
		width:630px;
		height:240px;
		background-position:center center;
		background-size: 630px 240px;
		background-repeat:no-repeat;                   
	}
	.menu {width:96%;}
	.pageOuter {max-width:630px;}
	.complete_line {width:96%;}
	.Product {
		width:96%;
		/* margin-left:0px; */
	}
	.page {
		/* max-width:626px;
		padding:0px 2px; */
	}
	.OuterTalenBlock {width:200px;}
	.tr {position:absolute;}
	.DefaultMockup {
		display:block;
		margin-left:10px;
		float:left;
		margin-bottom:15px;
		width:95%;
	}
	#MainContent_upGrafiek table tbody tr td {
		margin-left:0px;
		margin-right:0px;
		display:table-cell;
		padding:1px;
	}
	.Mockup h2 {min-height:47px;}
	.complete_line_m {display:none;}
	.product_bot {margin-left:10px;}
	.MainBig {
		margin-left:10px;
		width:96%
	}
	.MainMiddle {width:70%;}
	.breadcrumb {margin-left:10px;}
	#chart_div {/* height:200px; */}
	.datatable th:first-child{width:300px;}
}

@media all and (max-width:480px) {
	.caroufredsel_wrapper {height:200px!important;} 
	.FooterSliderImage{
		display:block;
		float:left;    
		width:470px;
		height:200px;
		background-position:center center;
		background-size: 470px 200px;
		background-repeat:no-repeat;                   
	}
	.page{
		/* max-width:466px;
		padding:2px;
		margin:0px; */
	}
	.pageOuter{max-width:470px;}
}

@media all and (max-width:320px) {
	.bannerTekst {width:320px!important; margin:0px!important;}

	.carousel-inner > .item > .divImage > div, .carousel-inner > .item > a > .divImage > div {width: 320px!important; margin:0px!important;}
	.carousel-inner > .item > .divImage > .knop, .carousel-inner > .item > a > .divImage > .knop {width: 60px!important; margin: 0 auto!important;}
	.pageOuter{min-width:320px!important;}

	.page{/* max-width:310px; */}
	.pageOuter{max-width:310px;}
	.FooterSliderImage{
		display:block;
		float:left;    
		width:310px;
		height:160px;
		background-position:center center;
		background-size: 310px 160px;
		background-repeat:no-repeat;                   
	}
	.outer_image_carousel{max-width:310px;}
}