@charset "utf-8";

/* CSS Document for Joomla 3 styles */
body {
	padding-top:0;
	padding-bottom:40px;
	background:url(../images/JMS_background_1600x900.png) top center no-repeat fixed;
	-webkit-background-size:cover;
/* Safari en Chrome */
	-moz-background-size:cover;
/*  Old Firefox */
	-o-background-size:cover;
/* Opera */
	background-size:cover;
/* W3C */
}

/* ===========================
	FONT STYLES
	========================== */
body {
	font-family:Verdana,Arial,sans-serif;
}

h1,h2,h3,h4,h5,h6 {
	font-family:'Open Sans Condensed',sans-serif;
	font-weight:700;
}

h1 {
	font-size:30px;
	line-height:34px;
}

h2 {
	font-size:26px;
	line-height:30px;
}

h3 {
	font-size:22px;
	line-height:26px;
}

h4 {
	font-size:18px;
	line-height:20px;
}

h5 {
	font-size:14px;
	line-height:20px;
}

h6 {
	font-size:12px;
	line-height:20px;
}

/* ======================
	GENERAL STYLES
	===================== */
/* Write your general styles here */



footer a:link,footer a:visited {
	color:#ffffff;
}

footer a:hover {
	color:#333333;
}


footer {
	background-color:#e32c22;
}

#content {
	margin-bottom:0px;
}

#power_by {
	float:right;
	padding-right:0px;
	font-size:100%;
	margin-top:3px;
	padding-top:0;
	color:#ffffff;
}

#jms {
	float:left;
	padding-left:0px;
	font-size:100%;
	margin-top:3px;
	padding-top:0;
	color:#ffffff;
}


.artikel {
	padding-left:20px;
	padding-right: 20px;
	background-color:#fff;
}

.artikel2 {
	padding-left:0px;
	padding-right: 20px;
	background-color:#fff;
	
}
.artikel3 {
	margin-left: 20px;
	margin-bottom:20px;
}
.artikel4 {
	margin-left: 5px;
	margin-bottom:20px;
}

.text {
	padding-left:0px;
	padding-top:0;
	margin-bottom:10px;
}

.text2 {
	margin-bottom:10px;
	padding-left:10px;
	padding-top:5px;
	padding-bottom:5px;
}

.text3 {
	color:#ffffff;
	padding-left:5px;
	padding-top:2px;

}
.text4 {
	margin-bottom:10px;
	padding-left:0px;
	padding-top:0px;
	padding-bottom:10px;
}


#footercontent {
	background-color:#e6e6e6;
	padding:0;
	padding-top:5px;
	padding-bottom:5px;
	box-sizing:content-box;
}

/* bootstrap.css */
.container {
	width:979px;
	background-color:#FFF;
	margin-right:auto;
	margin-left:auto;
	*zoom:1;
	box-sizing:border-box;
}

.container:before,.container:after {
	display:table;
	content:"";
	line-height:0;
}

.container:after {
	clear:both;
}

.row {
  margin-left: 0px;
}


/* bootstrap.css */
[class*="span"] {
	float:left;
	margin:0;
}

.span12 {
	width:979px;
}

.span11 {
	width:860px;
}

.span10 {
	width:780px;
}

.span9 {
	width:700px;
	
}

.span8 {
	width:620px;
}

.span7 {
	width:540px;
}

.span6 {
	width:460px;
	padding-left: 20px;
	padding-right: 0px;
    padding-bottom: 10px;
}

.span5 {
  width: 380px;
  float:right;
}
 
.span4 {
  width: 300px;
  padding-left: 20px;
  padding-right: 0px;
  padding-bottom: 10px;
}

.span3 {
	width:220px;
  	padding-left: 20px;
  	padding-right: 0px;
  	padding-bottom: 10px;
}

.span2 {
	width:140px;

}

.span1 {
	width:60px;

}



/* ===================================================================================
	BOOTSTRAP MEDIA QUERIES OVERRIDES
	NOTE: The order of the media queries is important when styles overwrite each other
	================================================================================== */
/*
@media (min-width: 1200px) {
  .nav-tabs > .active > a,
  .nav-tabs > .active > a:hover {
    border: none;
  }
  .container {
    width: 940px;
  }
   [class*="span"] {
    float: left;
    margin-left: 0px;
  }
}
*/
@media (min-width: 980px) {
	

	.nav-tabs > .active > a,.nav-tabs > .active > a:hover {
		border:none;
		color:#e32c22;
		margin-left: 10px;
	}
		.nav-tabs > li > a {
		font-size: 18px;
}

.nav-tabs > li, .nav-pills > li {
    margin-right: 5px;
}
	
	/*
	  .container {
	    width: 940px;
	  }
	*/
	/*
	  [class*="span"] {
	    float: left;
	    margin-left: 0px;
	  }
	*/
	/* Activates hovering the main items to show the sub items */
	.nav-pills > li > a,.dropdown-menu {
		margin:0;
	}
	
	.nav-pills > li.dropdown:hover ul.dropdown-menu,.nav-tabs > li.dropdown:hover ul.dropdown-menu {
		display:block;
	}
	
	.nav-pills > li.dropdown ul.dropdown-menu .dropdown-submenu .dropdown-menu,.nav-tabs > li.dropdown ul.dropdown-menu .dropdown-submenu .dropdown-menu {
		display:none;
	}
	
	.nav-pills > li.dropdown ul.dropdown-menu .dropdown-submenu:hover .dropdown-menu,.nav-tabs > li.dropdown ul.dropdown-menu .dropdown-submenu:hover .dropdown-menu {
		display:block;
	}
}

/* ============================================= */
@media (max-width: 979px) {

	.navigation {
		float:left;
		width:100%;
	}
	
	#categorie {
		float:left;
	/* 	width: 100%; */
	}
	
	.container {
		width:724px;
	}
	
	.hero-unit {	
		box-sizing: border-box;
	}
	
	.row,
	.hero-unit,
	.slideshow {	
		float: left;
		width: 100%;		
	}
	
	.container-content {
		float: left;
		margin-top: 20px;
	}
	
	[class*="span"] {
		float:none;
		display:block;
		width:auto;
	}
	
	.row {
		float:left;
		width:724px;
	}
	
	.span12 {
		width:724px;
		float:left;
	}
	
	.span11 {
		width:662px;
	}
	
	.span10 {
		width:600px;
	}
	
	.span9 {
		width:528px;
		margin-left:10px;
		float:left;
	}
	
	.span8 {
		width:476px;
	}
	
	.span7 {
		width:414px;
	}
	
	.span6 {
		width:352px;
		float:left;
		margin-left: 5px;
	}
	
	.span5 {
		width:290px;
	}
	
	.span4 {
		width:228px;
		margin-left:0px;
		float:left;
	}
	
	.span3 {
		width:166px;
		margin-right:-12px;
		float:left;
	}
	
	
	.span2 {
		width:104px;
		padding-right: 20px;
		float: left;
	}
	
	.span1 {
		width:42px;
		float:left;
	}
	
	
	
	
	/* menu */
	.nav-tabs > li {
		float:none;
	}
	
	.nav-tabs > .active > a,.nav-tabs > .active > a:hover {
		border:none;
	}	
	
	.nav-tabs > .active > a, .nav-tabs > .active > a:hover, .nav-tabs > .active > a:focus {
    	color: #e32c22;
}
	
	
}

/* ============================================= */
@media (max-width: 767px) {
	.nav-tabs > li {
		float:none;
	}
	
	.container {
		width:auto;
	}
	
	footer {
	background-color:#e32c22;
	height:35px;
}
	
	[class*="span"] {
		float:none;
		display:block;
		width:auto;
	}
	
	.span12 {
		width:100%;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	
	.row {
		width:100%;
	}
	
	.span9 {
		width:95%;
		margin-left:10px;
	}	
	
	.span6 {
		margin-right:20px;
	}
	
	.span3 {
		width:166px;

	}

	
	[class*="position"] {
		float:left;
		display:block;
		width:auto;
	}
	
	
}
/* ============================================= */
@media (max-width: 480px) {
	
	footer {
	background-color:#e32c22;
	height:70px;
}
	
	.span6 {
		margin-right:20px;
	}
	
	.span3 {
		margin-left:0px;
	}
	
}

/* ======================
	MODULES
	===================== */
.header {
	margin-bottom:20px;
}