/*
@@@@@@@@@@@@@@@@@@@@@@
RESPONSIVE
@@@@@@@@@@@@@@@@@@@@@@

	about				styles for responsive objects
	
	syntax

*/
@media all and (min-width: 1200px) 
{
	
	
		/*+ listBoxThumb
		..........................................................................*/
.layoutHeader .login { display:none; }
			.listBoxThumb.row > li:nth-child(4n){margin-right:25px;}


		/*+ well
		..........................................................................

			.well.gradient{border:0px; background:none; }

		+ boxChat
		..........................................................................*/

			.boxChat .chatItem{width:11%;}
			.boxChat .chatBox{width:87.5%;}
			/*.boxChat:nth-child(even) .chatItem{text-align:right;}*/
                        .boxChat.from .chatItem{text-align:right;}
                        


}	

@media all and (max-width: 979px)
{
	.layoutHeader .login { display:none; }
		/*+ listBoxThumb
		..........................................................................*/

			.listBoxThumb.row > li:nth-child(4n){margin-right:25px;}
			
			.listBoxThumb.column2 > li:nth-child(2n){float:none;}
			.listBoxThumb.column2 > li{float:none; margin:0px 0px 15px 0px; }
			.listBoxThumb.column2 > li .boxThumb.portrait{width:auto;}
			.listBoxThumb.column > li{float:left;}

			.boxBigIntro{width:725px;}
			.boxMainSearch{position:relative; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=95)"; filter: alpha(opacity=95); opacity:0.95;}
	
	
		/*+ boxChat
		..........................................................................*/

			.boxChat .chatItem{width:22%;}
			.boxChat .chatBox{width:78%;}
                        .boxChat.from .chatItem{text-align:right;}
			/*.boxChat:nth-child(even) .chatItem{text-align:right;}*/
	
	
		/*+ boxBeelden
		..........................................................................*/

			.boxBeelden .primary{float:none; width:100%;}
			.boxBeelden .images{float:right; width:55%;}
			
			.boxBeelden .images ul{overflow:hidden; margin:0px 0px 10px 0px; }
			.boxBeelden .images ul li{width:48%; float:left; margin-right:2%; margin-bottom:10px;}
			.boxBeelden .images ul li:nth-child(even){margin-left:2%; margin-right:0;}
			
			.boxBeelden a{color:white; }
			
			.boxBeelden .boxFigureThumb{display:block; margin-bottom:10px;}
			.boxBeelden .boxFigureThumb img{width:100%;}
	
		/*+ boxInlineButtons
		..........................................................................*/

			.boxInlineButtons{margin:0px 0px 20px 0px; text-align:left; }
			.boxInlineButtons a{margin:0px 0px 5px 0px;}
}	
		
@media (max-width: 765px)
{
body { padding-left: 0; padding-right: 0; }
		/*+ html
		..........................................................................*/
			
			/*background*/
			

		/*+ layoutFooter
		..........................................................................*/

			.layoutFooter{padding:15px 20px;}
			.layoutFooter .bottom{margin:0px -10px -10px -10px; padding:10px;}

			.layoutFooter .grid .gridSpan6 + .gridSpan6{margin:0px 0px 0px 0px; margin-bottom:15px; width:100%;}

			.layoutFooter figure.gecertificeerd i{display:none; }
			
			
		/*+ layoutSection
		..........................................................................*/

			.layoutSection, .layoutFooter{ padding:  10px;}


		/*+ layoutHeader
		..........................................................................*/

			.layoutHeader, .layoutHeader > .container{height:auto;}
			
			.layoutHeader .topBar{text-align:center; position:static;  padding:10px 0px;}
			
			.layoutHeader .topBar ul li{margin:0px 5px 0px 10px; }
			.layoutHeader .topBar p{display:none; }

		/*+ login
		..........................................................................*/

			.layoutHeader .login{position:static; padding:50px 10px 10px 10px; margin:10px 0px 0px 0px; display:block; }
			.layoutHeader .login .loginForm input{margin:0px 10px 10px 0px; }
			.layoutHeader .login .loginForm button{display:block; width:100%;}
			
			.layoutHeader .login .loginForm .line2{left:auto; right:0px;color:#747576}
			
			.layoutHeader .login .loginForm .icoLock{display:none; }

			.layoutHeader .login.active{padding:20px 0px 0px 0px; }
			.layoutHeader .login.active span{margin-right:5px;}
			.layoutHeader .login.active .btn-primary{margin:0px 0px 0px 0px; }

		/*+ name
		..........................................................................*/
			
			.layoutHeader .name{}
			.layoutHeader .name h1{ }
			.layoutHeader .name .imgLogo{ width:200px; background-size:100%;}

		/*+ menu
		..........................................................................*/
.layoutHeader .menu{border:0px; position:fixed; top:50%; right:50%; bottom:50%; left:50%; z-index:1000;   -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out;}
   .layoutHeader .menu.active{border:1px solid #d3d3d3; position:fixed; top:2%; right:2%; bottom:2%; left:2%;  }
			/*.layoutHeader .menu{position:fixed; top:50%; right:50%; bottom:50%; left:50%; z-index:1000;   -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out;}
			.layoutHeader .menu.active{position:fixed; top:2%; right:2%; bottom:2%; left:2%;  } */
                         
			.layoutHeader .menu ul{border:0px;  display:block; }
			.layoutHeader .menu ul li{display:block; float:none; border:0px;  border-bottom:1px solid rgba(0,0,0,0.1); border-top:1px solid rgba(255,255,255,0.3);}

			.layoutHeader .menu .toggleMenu{padding:5px 10px; display:block; border:0px; background:none; position:absolute; top:10px; left:auto; right:5px; font-size:24px;}

			.layoutHeader .toggleMenu{display:block; position:absolute; top:15px; right:15px; dz-index:10000; }

		/*+ breadcrumb
		..........................................................................*/

			.breadcrumb{display:none; }


		/*+ grid
		..........................................................................*/

			.grid .gridSpan1,.grid .gridSpan2,.grid .gridSpan3,.grid .gridSpan4,.grid .gridSpan5,.grid .gridSpan6,.gridSpan7,.grid .gridSpan8,.grid .gridSpan9,.grid .gridSpan10,.grid .gridSpan11,.grid .gridSpan12{width:100%; float:none; margin:0px 0px 0px 0px;  margin-bottom:15px;}

		/*+ boxBigIntro
		..........................................................................*/

			.boxBigIntro{width: auto;}
			.boxMainSearch{height:auto; position:static;}


		/*+ listBoxThumb
		..........................................................................*/

			.listBoxThumb.row > li{margin:0px 0px 15px 0px; }
			.listBoxThumb > li{width:50%; padding:0px 10px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
			.listBoxThumb.row .boxThumb.landscape{width:100%;}

			.listBoxThumb.row > li:nth-child(4n){margin-right:0px;}

		/*+ boxChat
		..........................................................................*/

			.boxChat:before{display:none; }
			.boxChat .chatItem{width:15%;}
			.boxChat .chatBox{width:85%;}

		/*+ noPhone
		..........................................................................*/

			.noPhone{display:none; }
/*+ boxNavigation
  ..........................................................................*/

   .boxNavigation{height:28px; overflow:hidden; cursor:pointer;}
   .boxNavigation.active{height:auto;}
   .boxNavigation .ghostButton{display:block; position:absolute; top:0px; left:0px; right:0; height:42px; }
.boxNavigation .ghostButton i{position:absolute; top:12px; right:10px;}
.boxNavigation .ghostButton i + i{display:none; }

   .boxNavigation.active .ghostButton i{display:none; }
   .boxNavigation.active .ghostButton i + i{display:block; }

}	
		
@media (min-width: 480px) and (max-width: 765px)
{
	
}	

@media all and (max-width: 482px) /*+ fadsas dit was eerst 479 */
{
	.firstmessage { float: none;}
            body { padding-left: 0; padding-right: 0; }
            #nietgenoeg, .nietgenoeg { display: block }
            #nietgenoeg_code { display: none }
		/*+ boxBigIntro
		..........................................................................*/

			.boxBigIntro .btn{position:absolute; bottom:15px; left:15px; font-size:15px; padding:10px;}
	
		/*+ boxBigIntro
		..........................................................................*/

			.boxThumb{font-size:13px; line-height:25px;}
	
		/*+ listBoxThumb
		..........................................................................*/

			.listBoxThumb > li{float:none;}
			
			.listBoxThumb > li{width:100%; padding:0px 0px 0px 0px;  margin:0px 0px 10px 0px; }

			.listBoxThumb.column2 > li:nth-child(2n){margin-right:0; float:right;}
			
			.listBoxThumb.column{margin:0px 0px 0px 0px; }
			.listBoxThumb.column > li{float:none; margin-right:0px; }

			.listBoxThumb.row > li{margin-right:0px;}
			.listBoxThumb.row > li:nth-child(4n){margin-right:0px;}
			.listBoxThumb.row .boxThumb.landscape{width:auto;}

		/*+ boxChat
		..........................................................................*/

			.boxChat .chatItem{width:20%;}
			.boxChat .chatBox{width:80%;}


}