/*  border:1px dotted lime; */

@media (max-width: 1024px) {

.total											{margin: 0px 10px; display:block; width:inherit; max-width:inherit; padding:0; position: relative; top: 0px;}
#home.total										{margin: 0px 10px; display:block; width:inherit; max-width:inherit; padding:0; position: relative; top: 0px;}
h1												{margin-left:20px; font-size: 26px;}
h2												{margin:15px; font-size: 20px; white-space:normal !important;}

.ms-rtestate-field								{float:none;}
.ms-rtestate-field h2.ms-webpart-titleText span	{float: none;}

.container										{width:99%; background-attachment: scroll; padding:0px; margin:0;}

.navigation, .content							{width:100%; display:block; text-align:left; clear:both;}

.navigation										{position: relative; height:auto; background:none;}
.navigation .top								{height:auto;}
	.logo										{padding: 40px 0px 0px 30px; margin:auto;}
		.menu-button							{display:inline-block; width:40px; height:40px; float:right; margin:20px 20px 0 0;}

.navigation .bottom								{display:block; margin: 0 0 0 0px; padding: 0 0 20px 0px; border:0px solid #0072c6; background-color: #596EFE; width: 100%);}
.flag-container									{width: calc(100% - 20px);}

.nav											{margin-top:0px;}
.menu-div										{display:none; height:auto;}
.mobile-visible									{display:block; margin-bottom:15px;}

.search											{border:0px dotted gray; width:auto; display:none; clear:both; margin:20px 0; padding:10px 0;}

.navSearch										{display:block; margin: 0px 0 0 0px; padding: 0 0 20px 20px; border:0px solid #0072c6; background-color: #FFFFFF; }
.navSearch input[type=text]						{background:white; color:#888888; padding:5px; height:30px; width: 240px;}
.navSearch a 									{background: url("../images/USAR-search-1.png") no-repeat; display:inline-block; float:right; position:relative; width: 40px; height: 40px; margin:0; padding:0; float: right; cursor: pointer; }

.content 										{width:100%; height: 100%; min-height:912px; text-align: left; margin:auto; padding-top:30px}

.device											{padding: 0 0 20px 0;}

#srchRightResults								{width:100%;}

#srchHeader										{float: left; display: block; width: 780px; text-align:right; border:0px dotted orange;}
#srchHeader	div									{float: left; border:0px dotted blue;}

#srchHeaderFilterYesNo							{background: #f0f0f0 url("../images/USAR-plus.png") no-repeat 200px 0px; width: 180px;}
#srchHeaderSort select							{background: #f0f0f0 url("../images/USAR-arrow.png") no-repeat 200px 0px; width: 240px;}

#srchHeaderDisplay								{width: 240px;}
#srchHeaderDisplay select						{background: #f0f0f0 url("../images/usar-view-4.png") no-repeat 180px 0px; width: 240px;}
#srchHeaderDisplay select.listdisplay 			{background: #f0f0f0 url("../images/USAR-view-2.png") no-repeat 190px 0px;}
#srchHeaderDisplay select.blockdisplay 			{background: #f0f0f0 url("../images/usar-view-4.png") no-repeat 190px 0px;}

#srchLeftFilter									{border:0px dashed #ccc; clear:left; padding-left:20px;}

#srchLeftFilter .ms-ref-refiner #Value			{width:auto!important;}

.kennisthemas 									{border:0px dashed #ccc; overflow:visible; display:block; width:inherit; width:100%; margin:0 0px; padding:0; height:auto;}

.componentControls								{border:0px dashed lime;} /* position:relative !important; float:right;*/

#homepage-column1								{margin-right: 0px;}

/* Kennisthema's */

.kennisthemas									{width: 100%; float: left; padding:10px 0 10px 20px; display:block;}
.kennisthema									{width: 100%; height: 80px; float: none; margin-right: 1px; margin-bottom: 10px; display:block; clear:both; border:0px dashed blue; }
.kennis-foto									{width: 80px; height: 80px; float: left; background: black; margin-right:10px;}
.kennis-titel									{width: calc(100% - 100px); padding-top: 30px; height: 80px; float: left; margin:0 1px; }

.sizing											{float: left; position: relative;}
.jfade_image									{float: left; position: relative; z-index: 9;}

.thematoelichting								{float: left; background: white; width:auto; height: auto; text-align: justify; padding: 5px 20px 0 20px; margin: 50px 0 0 80px; position: absolute; z-index: 99; display: none; border-bottom:1px solid #ccc;}
.jfade_image:hover .thematoelichting			{display: none;}

.kennis-foto img								{width: 80px; height: 80px;}
.kennisthemas h4								{color: #00314e!important;}
.kennisthemas h1								{opacity:1.0!important;}

.tab-content									{width:inherit; padding: 20px 0px 30px 20px;}
.tab-list-item .foto							{float: left; width: 160px; height:160px; overflow:hidden;}
.tab-list-item .foto img						{max-width:160px;}
.tab-list-item .text							{float: left; margin-left: 15px;}
.tab-list-item									{padding: 10px 0 30px 0; float : left; border-bottom: 1px solid #cfcfcf; display:block; width:100%;}
/* //Kennisthema's */

.subnav											{width:100%;}

/* recent items */

.recent-items .item:nth-child(2)                 {padding-bottom:0px; border-bottom:0px solid #ccc; border-right:1px solid #ccc;}


/* //recent items */

/*#s4-workspace									{width:inherit !important; height:inherit !important;}*/

.samenvatting 									{padding: 5px; max-width: 920px;}
.relevant 										{float: left; margin-bottom: 50px; width:auto;}

.contactfooter 									{width: inherit; height: 100px; text-align: left; margin-left: 0px;padding-right:0px; max-width:1023px;}

.relevant .button-red							{display:none;}
}

@media (max-width: 800px) {
#suiteBar										{display:none!important;}
#s4-ribbonrow									{display:none!important;}

.recent-items .item:first-child                	{width:100%;}

.container										{width:97%;}

.relevant .button-red							{display:none;}
.swiper-container								{width: 100%; max-width: 720px; }

}

@media (max-width: 768px) {

.total h1										{width: 90%;}


.recent-items .item:first-child                	{width:100%;}

.kennisthemas 									{width:100%;}

.footer-contact									{clear:both; width:auto; float:none;}

.swiper-container								{width: 100%; max-width: 700px;}

}



@media (max-width: 650px) {
h1 {margin: 0px 0px 40px 0px}
.kolom1, .kolom2 								{font-size: 12px;   }

.screen-placeholder,
.recent-placeholder								{display: none;}

.swiper-placeholder,	
.mobile-placeholder								{display: block; }

.item-photo 									{width: 100%; display: inline; float: left; overflow: hidden;}

.device 										{width: 100%; max-width: 620px; height: 400px; margin: auto; position: relative; display: block;}
.swiper-container								{width: 100%; max-width: 580px;}
.swiper-swapper									{width: 100% !important;}

.content-slide .meta							{width: 100%; max-width: 620px; padding-top: 10px;}
.item-photo img									{width: 100%; max-width: 620px;}

.container										{width:97%;}

.ms-webpart-cell-vertical,
.ms-webpart-chrome-vertical						{display:block;}

#srchHeader										{width: 100%; text-align:center;}
.tab-content									{width:100%;}

#srchHeaderFilterYesNo							{margin-left: 0px;}
#srchHeaderSort select							{margin-left: 0px; background: #f0f0f0 url("../images/USAR-arrow.png") no-repeat 200px 0px; width: 260px;}
#srchHeaderDisplay select						{margin-left: 0px; background: #f0f0f0 url("../images/usar-view-4.png") no-repeat 200px 0px; width: 260px;}

#srchHeaderDisplay select.listdisplay 			{background: #f0f0f0 url("../images/USAR-view-2.png") no-repeat 210px 0px;}
#srchHeaderDisplay select.blockdisplay 			{background: #f0f0f0 url("../images/usar-view-4.png") no-repeat 210px 0px;}

.ms-srch-result #Paging							{margin:0px 60px 60px 0px;}

.footer-bar										{height:auto; padding: 30px 10px 30px 10px;}
.footer-bar .verfijnen							{float:none; clear:both; }
.footer-bar .verfijnen a   	 				    {margin-left: 200px; padding-right: 70px;}

.relevant 										{min-height:inherit;}
.relevant .button-red							{display:none;}

.usar-articledocs-itemdetails					{margin:0; padding-left:0px;}
.usar-articledocs-filename						{width:100%;padding-left:10px;}
.usar-articledocs-download						{width:100%;padding-left:10px;}

.tab-list-item .text							{margin:10px 0px 0px 0px;}

.content										{min-height:200px;}

.ms-formbody select,								
.ms-formbody .ms-long							{width:100%;}

}



@media (max-width: 640px) {
.device 										{width: 100%; max-width: 580px; height: 400px; padding: 0 0 20px 0; margin: auto; position: relative; display: block;}
.swiper-container								{width: 100%; max-width: 580px; height: 400px;}
.tab-content .ms-rtestate-field 				{width: 580px;}
.tab-content .ms-rtestate-field .actueel		{width: 580px;}
.tab-content .ms-rtestate-field .accordion		{width: 580px;}

.item-photo img									{width: 100%; max-width: 580px;}

.kennisthemas 									{width:100%; max-width:580px;}

}

@media (max-width: 480px) {
.device 										{width: 100%; max-width: 420px; height: 300px; padding: 0 0 20px 0; margin: auto; position: relative; display: block;}
.total h1										{width: auto;}

.relevant h3									{padding-top: 0px;}
.tab-content .ms-rtestate-field 				{width: 100%; max-width: 420px;}
.tab-content .ms-rtestate-field .actueel		{width: 100%; max-width: 420px;}
.tab-content .ms-rtestate-field .accordion		{width: 100%; max-width: 420px;}

.tabbladen 										{padding: 0 0 0 0px;}
.tab-button a 									{padding: 10px;}

.footer-bar .verfijnen 							{margin: 20px 10px 0px 0px;}
.footer-bar .verfijnen a 						{padding: 10px 35px 10px 10px; width:75%; display:block; margin:0;}

.ms-srch-result									{width: 100%; max-width: 440px;}
#ResultCount									{float: right;}
.usar-articledocs-filename						{width: 100%;}

.footer-form									{width: 300px; border: 0px solid red;}
.footer-form select								{width: 320px!important;}
.footer-contact									{float: left;}

.content-slide .meta							{width: 100%; max-width: 420px;}
.item-photo img									{width: 100%; max-width: 420px;}

.kolom1, .kolom2								{font-size: 12px;}
.kolom2 .samen-antw	img							{max-width: 100px;}
.tab-list-item .text							{width: 220px;}

.recent-items .item:first-child					{width: 100%;}
.recent-items .item:first-child .item-photo		{width: 180px;}	
.recent-placeholder h2.ms-webpart-titleText		{width: 90%;}

.kennisthemas 									{width:100%; max-width:420px;}

.kolom1, 
.kolom2											{width:auto; float:none; clear:both;}

.swiper-container								{width: 100%; max-width: 420px; height: 320px;}

}