/* ********************************************************************** print layout */
@media print {
	#container_nav,
	#nav_top          { display: none; 			}
	a:link, a:active, a:visited, a:hover,
	body, .tekst, td, h1 { color: #000000;       }
	html, body, div#bg,
	#content 					{ background: none; background-color: #FFFFFF; }
	#container        { width: 740px; 			}
}

/* ************************************************************************** algemeen */
.never_show  { display: none !important; }

#container_nav_mobile {
	display: none;
	background-color: #009fe3;
	clear:both;
}
#nav_button_mobile {
	display: none; 
	background: url('img/mobile_nav_button.jpg') no-repeat;
	background-position: 50% 50%;
	cursor: pointer;
	position: absolute;
	right: 10px;
	top: 6px;
	height: 28px;
	width: 40px;
	border-style: solid;
	border-width: 1px;
}

/* moet in layout staan!! */
#content img { max-width: 100%; height: auto; } /* verklein afbeeldingen als ze groter zijn dan de breedte van de content */
#content #container_content_map img { max-width: none; }  /* BEHALVE BIJ GOOGLE MAPS!!!!! */

.show_resp1,
.show_resp2,
.show_resp3,
.show_resp4            { height:0px; overflow:hidden; font-size: 0.0000001em;}

/* ********************************************************************** responsive 1 */
@media only screen and (max-width: 1025px){
	
	.group_warranty #content img { display: none; }
	
	.hide_resp1        { display:none; }
	.show_resp1        { height: auto; overflow: visible; font-size: inherit;}

	#header_content, #content_nav, #container, #bottom_content, #bottom_copy { width: 100% }

	#content table,
	#content table td,
	#content table tr	{ max-width: 100% !important; height: auto !important; } /* en tabellen als ze groter zijn dan de breedte van de content */
	
	#container_lang_choice { padding-top: 13%; }
	
	#contactform .input { clear: both; }


/*	#content_nav      {font-size: 14px; } */

/*	#c_h               { margin-right: -350px; }
	#container         { width: 600px;         }
	#container_header  { width: 600px;         }
	#header_afb        { width: 600px;         }
	#container_left    { display: none;        } /* hide_resp1 */
/*	#logo img          { max-height: 200px;    }
	#content table     { table-layout: fixed !important; width: 100% !important; }
	*/
}

/*
@media only screen and (max-width: 950px) {
	#content_nav      {font-size: 13px; }
}

@media only screen and (max-width: 885px) {
	#content_nav      {font-size: 12px; }
}
*/
@media only screen and (max-width: 850px) {
	.group_nav .nav_chain li a.active       { padding-left: 15px; }
	.group_nav .nav_chain li a.active:after { content: " >"; } 

	#container_lang_choice { padding-top: 14%; }
}

@media only screen and (max-width: 810px) {
	#contactform { width: 260px; clear: both; }
}

@media only screen and (max-width: 750px) {
	#nav_button_mobile { display: block; }
	#nav               { display: none; } 

	#searchbox         { right: 60px; top: 7px; }

	.instruction        { width: 100%; border-spacing: 0; }
	.instruction td     { padding-top: 3px; }

	#container_lang_choice { padding-top: 15%; }

	#contactform p.narrow label  { width: 19%; }
	#contactform p.narrow select { width: 55%; }
}

/* ********************************************************************** responsive 2 */
@media only screen and (max-width: 630px) {
	.hide_resp2         { display:none; }
	.show_resp2         { height: auto; overflow: visible; font-size: inherit; }
	
	.titel, h1          {font-size: 30px; }
	.kop, h2            {font-size: 20px; }
	.subkop, h3         {font-size: 15px; }
	.itemkop, th, h4    {font-size: 12px; }
	.tekst, td, body    {font-size: 12px; }
	
/*		#c_h                { margin-right: -240px;}
	#container          { width: 480px;        }
	#container_header   { width: 480px; height: 150px; margin-top: 0px; }
	#header_afb         { width: 480px; height: 150px; }
	#logo               { top: 30px;           }
	#logo img           { max-height: 150px;   }
	#social_media       { left: 0px;top: 0px;  }
	#container_content  { width: 480px;        }
	#content_nav        { left: 9px; width: 470px; }
	#content            { width:450px; margin: 75px 0 0 15px; }
*/
	#contactform input,
	#contactform textarea,
	#reactieform input,
	#reactieform textarea,
	input, textarea     { width: 225px;        }

	#container_lang_choice { padding-top: 16%; }
	
	.product_info          { padding: 30px 0 0 30px; }
	
}

/* ********************************************************************** responsive 3 */
@media only screen and (max-width: 480px) {
	.hide_resp3         { display:none; }
	.show_resp3         { height: auto; overflow: visible; font-size: inherit;}

	.titel, h1          {font-size: 26px; }
	.kop, h2            {font-size: 18px; }
	
	#logo                    { top: 6px !important;
														 z-index: 101;}
	#logo img                { width: 80px !important; margin-left: 0px;}
	.btn {height: 23px; width: 23px; margin-top: 2px;}

	#content                 { width: 127%; left: -27% }

	.product_info          { padding: 15px 0 0 15px; }

	.container_home #content { width: 100%; left: 0% }
	#contactform p.narrow select { width: 79.3%; }	
	
	
/*		#c_h                { margin-right: 0px;   }
	#container          { min-width: 320px;  width: 100%;   }
	#container_header   { min-width: 320px;  width: 100%; height: 150px; }
	#header_afb         { min-width: 320px;  width: 100%; height: 150px; }
	#social_media       { left: 0px; top: 0px; }
	#container_content  { min-width: 320px;  width: 100%; }
	#content_nav        { width: 98%;  left: 2px; }
*/
	#content table      { max-width: 100%;     }
	#contactform label,
	#reactieform label  { width: 75px;         }

	#container_lang_choice { padding-top: 17%; }

	#contactform, #reactieform { width: 98%; }
	#contactform .input input,
	#contactform .input textarea,
	#contactform .input select { width: 100%; }
	
	
}


/* ********************************************************************** responsive 4 */
@media only screen and (max-width: 420px) {
	.btn {height: 20px; width: 20px; margin-top: 5px;}
	
	.hide_resp4         { display:none; }
	.show_resp4         { height: auto; overflow: visible; font-size: inherit;}

	.group { width: 32.5%; }
	#group_empty { width: 1%;margin-left:-1%; margin-right: 0;}
	
	.group_g       { width: 30.5%; }	
	#content       { width: 150%; left: -50% }
	.content_right { width: 66% }
	
	.cta,
	.product_left,
	.product_right { width: 100%; }
	#contactform label,
	#reactieform label  { width: 60px; }

	#contactform p.narrow select { width: 79%; }	

	#contactform p,
	#reactieform p      { clear: both; }
}

/* ************************************************************** responsive navigatie */

/* *********************************************************** LEVEL 1 main navigation */
ul.mobile_nav {
	width: 100%;
	list-style: none outside none;
	margin: 0;
	padding-top: 40px;
}

ul.mobile_nav li { 
	line-height: 30px;
	border-bottom: 1px solid #2C2C2C;
	margin: 0 0 0 0;
}

ul.mobile_nav li a{
  padding-left: 10px;
  text-decoration: none;
	display: block;
	color: #EEEEEE;
}

ul.mobile_nav li.active,
ul.mobile_nav li a:hover {
	background-color: #DDDDDD;
}

ul.mobile_nav li.active a,
ul.mobile_nav li a:hover {
	color: #111111;
}

/* ************************************************************* LEVEL 2 subnavigation */
ul.mobile_nav li ul { 	
	list-style:none;
	width: 100%;
	list-style: none outside none;
	margin: 0 0 0 0;
	background-color: #009fe3;
}
ul.mobile_nav li ul li {
	padding-left: 20px !important;
	line-height: 22px;
	border-bottom: none;
}

/* ********************************************************* LEVEL 3 sub-subnavigation */
ul.mobile_nav li ul li ul { 	
	list-style:none;
	width: 100%;
	list-style: none outside none;
	margin: 0 0 0 0;
}
ul.mobile_nav li ul li ul li{
	margin-left: -20px;
	padding-left: 40px !important;
}