﻿

/* MOBIEL */
@media (max-width: 767px) {
	body{
		padding: 0;	
		background-image: none;
	}

	
	.mainmenu{
		display: none;	
	}

	.mainmenu_wrapper{
		position: relative;	
	}
	
	.top-nav.affix{
		position: relative;
	}
	.navbar_mobileLeft, .navbar_mobileRight{
		width: 50%;
		float: left;
	}

		.tab{
			padding: 0 0;	
		}
		
			.tab h1{
				font-size: 16px;	
				padding: 0 15px;
			}
		
		.tab.jaar{
			font-size: 18px;
			padding: 0 15px;
		}
		
		.tab.pijl .dropdown-toggle{
			padding: 20px 10px;	
			box-shadow: none;
		}
		
		.dropdown-menu.jaren{
			width: 98px;	
		}
		
	.content{
		padding: 0 25px 25px 15px;	
	}
	
		a.button{
			margin: 3px;
    		padding: 3px 7px;	
		}
		
		.tabs-middle{
			width: auto !important;	
			margin: -1px auto auto;
			float: none;
		}
		
			.nav-tabs > li{
				width: 25%;	
			}
		
			.nav-tabs > li > a{
				margin: 0 2%;
				font-size: 10px;
				text-align: center;
			}

	
		.nav.nav-tabs > li > a > img{
			margin: 0;	
		}
		
	.content.graph{
		float: left;
		width: 100%;
		padding: 0;
	}
	
	.content.bumper{
		padding: 0 25px 25px 15px;		
	}
	
		tspan{
			text-decoration: underline;	
		}
		
		.content.bottom{
			padding: 15px 25px 15px 15px;
		}
		
		.dvContent{
			width: 100%;
		}
	
	.bumper body{
		background: #F3F3F3;	
	}
	
	.mainmenu{
		min-height: 0;	
	}

	.homepage .mainmenu{
		display: none;	
	}	
	
	.bumper .tab h1{
		font-size: 22px;	
	}
	
	.bumper .tab{
		margin-top: -40px;	
	}
	
	
	.bumper .tab_wrapper{
		margin: 0 0 0 0;
	}
	
	
	.accountBlokWrapper{
		width: 33.3%;	
	}
	
	@media (max-width: 620px) {
		.accountBlokWrapper{
			width: 50%;	
		}	
	}
	
	.accountBlok{
		width: 180px;
		margin: 15px 5%;
	}

    .accountBlok a {
           width: 180px; 
           height: 198px;
           display: block; 
        }


        .accountBlok .accountBlok_plaat,
        .accountBlok .accountBlok_plaat img {
            width: 180px;
            height: 118px;
        }

		.accountBlok  .accountBlok_label{
		    width: 160px;
			overflow: hidden;	
			font-size: 14px;
			padding: 20px 0 20px 20px;
		}

	.chart{
		width: 100%;
		height: 250px;	
	}
	
		.chart.donut{
			width: 100%;
		}
		
	.accountBlokkenWrapper{
		width: 100%;	
	}
	
		
	.content_inner{
		width: 100%;	
	}
	
	.content_barometer.centered{
		margin-right: 30%;	
	}
	
	h1{
		font-size: 16px;	
	}
	
	.fixed-fixed{
		margin: 0 0 0 0px;	
	}
	
	.fixed-fluid{
		margin-left: 0;	
	}
	
	.container-fluid.white,
	section.white{
		background: #FFF !important;	
	}
	
	/*footer{
		margin: 0 !important;
	}*/

}

@media (max-width: 480px) {
    a.button {
        /*width: 100%;*/
    }

    .homepage .container.tekst_home ul {
        margin: 0;
    }

    .accountBlokWrapper {
        width: 100%;
     }

    .accountBlok {
        width: 100%;
        float: none; 
        margin: 10px auto;
    }

    .accountBlok a {
	   width: 100%;
	   height: 92px;
	   display: block; 
	}

        .accountBlok .accountBlok_plaat {
            width: 50%; 
            height: 92px; 
        }

        .accountBlok .accountBlok_plaat img{
            width: 100%;
            max-height: 92px; 
        }
		
        .accountBlok  .accountBlok_label{
			width: 50%;	
			padding: 0;
			height: auto;
		}
		
		.accountBlok_label_inner{
			overflow: hidden;
			font-size: 14px;
			padding: 20px 0 20px 10px;
		}
		
	.chart.donut{
		width: 100%;
		height: 200px;
	}
	
	.bumper .tab{
		position: relative;
	}
	
	.content_barometer.centered{
		margin-right: 40%;	
	}
	
		.form-horizontal{
		width: 100%;	
	}
	
	.bumper .tab h1{
		line-height: 30px;	
		padding-top: 15px;
	}

}

@media (max-width: 230px) {
	 .accountBlok .accountBlok_plaat {
		width: 100%; 
		height: 92px; 
	}
	
		.accountBlok  .accountBlok_label{
			width: 100%;	
			padding: 0;
			height: 65px;
		}
		
		.accountBlok_label_inner{
			overflow: hidden;
			font-size: 14px;
			padding: 20px 10px 20px 10px;
			
		}
}

