@media screen and (min-width: 800px) {
	.subNav {
		list-style: none;
		padding: 0;
		margin: 0;
		display: none;
		margin-top: 12px;
	    position: absolute;
	    margin-left: -20px;
	    z-index: 1;
		width: 100%;
		max-width: 1000px;
	}
	
	.subNav > li {
		text-align: center;
		float: left;
	    background-color: rgb(211,231,215);
	    padding: 12px;
	}
	
	.subNav > li > a {
		color: #3d9a56 !important;
		text-decoration: none !important;
		font-weight: bold;
	}
	
	#navigation > ul > li:hover {
		background-color: rgb(211,231,215);
	}
	
	#navigation > ul > li:hover > a {
		color: #3d9a56;
		text-decoration: none !important;
		font-weight: bold;
	}
	
	.sub:hover {
		background-color: #0d812c;
	}
}
@media screen and (max-width: 911px) {
	.courseWrapper {
    	width: calc(33.33% - 20px);
	}
}
@media(max-width: 760px) {
	#footerLeft {
	    padding: 10px;
	    width: calc(100% - 20px);
	    float: none;
	    text-align: center;
	}
	
	#footerRight {
	    padding: 10px;
	    width: calc(100% - 20px);
	    float: none;
	    text-align: center;
	}	
}

@media screen and (max-width: 800px) {
	#logoWrap img {
	    width: 180px;
	}
	#bg-home {
		width: 180px;
	}
	#choose {
		width: 300px;
		margin: auto;
		margin-top: 150px;
	}
	
	.textfield {
		width: calc(100% - 14px);
	}
	
	.textarea {
		width: calc(100% - 12px);
	}
	.table-cart-info {
		width: calc(100% - 12px);
	}
	.item {
		width: 250px;
	}
	
	.top {
		width: 250px;
	}
	
	.center {
		width: 250px;
	}
	
	.chooseHeader {
		font-size: 21px;
	}

	.overview {
		width: 100%;
		float: none;
	}
	
	.courseContent {
		width: 100%;
		float: none;
		padding: 0;
	}
	
	.re {
		width: 100% !important;
	}
	
	.arrow {
		right: 5px;
	}
	
	.Carrow {
		right: 5px;
	}
	
	.emp_data {
		width: calc(100% - 20px);
		float: none;
	}
	
	.emp_pic {
		width: calc(100% - 20px);
		float: none;
	}
	
	.scriptDetails {
		width: 100%;
		float: none;
		padding-right: 0px;
	}
	
	.scriptDownload {
		width: 100%;
		padding-left: 0px;
		padding-top: 10px;
		float: none;
	}
	
	div.tab button {
		width: 100%;
	}
	
	#wrapper {
		padding-left: 5px;
		padding-right: 5px;
	}
	
	#menu-bars {
		display: block;
		cursor: pointer;
		width: 40px;
		padding: 10px;
		padding-left: 0px;
		padding-right: 20px;
	}
	
	#navigation {
		padding-left: 20px;
		padding-right: 20px;
	}
	
	#navigation > ul {
		display: none;
	}
	
	.opened > ul {
		display: block !important;
	}
	
	.opened .subNav {
		display: block !important;
	}
	
	.opened .subNav a {
		font-weight: 200;
		font-size: 16px;
	}
	
	.opened > ul > li {
		float: none !important;
		width: 100% !important;
		text-align: left !important;
	}

	.opened > ul > li > a {
		font-weight: bold;
		font-size: 16px;
	}
	
	.subNav > li {
		width: 100% !important;
	}
	
	.kachel {
		width: calc(100% - 30px);
		float: none;
		margin: 10px;
	}
	
	.kachelHeading {
		min-height: 50px;
	}
	
	.kachelContent {
		display: none;
	}
	
	.kachel:hover .kachelContent {
		display: block;
	}
	
	#bg-home {
	    width: 200px;
	}
	
	#logoWrap {
		padding-top: 10px;
	}
	
	#logoWrap > h1 {
		font-size: 1.4em;
	}
	
	#homeContainer {
		margin-top: 50px;
	}
	
	.courseWrapper {
    	width: calc(50% - 20px);
	}
	
	.locationItem > .left, .locationItem > .right {
		width: 100%;
	}
	
	#profileLeft {
		width: 100%;
		margin: none;
		float: none;
		margin-bottom: 20px;
	}
	
	#profileRight {
		width: 100%;
		padding: 0px;
		padding-top: 20px;
		border-left: none;
		border-top: 1px solid grey;
		float: none;
	}
	
	
	#infos #left {
		width: 100%;
		margin-right: 0px;
		float: none;
	}
	
	#infos #middle {
		width: 100%;
		float: none;
		overflow: hidden;
	}
	
	#infos #right {
		width: 100%;
		margin-left: 0px;
		float: none;
	}
	
	#archiveStart #categories {
		width: 100%; 
		float: none;
		margin-right: 0px;
		border: 1px solid grey;
	}
	
	#archiveStart #searchTable {
		width: calc(100% - 10px); 
		float: none;
		margin: 5px;
	}
}

@media screen and (max-width: 500px) {
	.courseWrapper {
    	width: calc(100% - 20px);
	}
	
	.course {
		height: auto;
	}
	
	.courseOverImage {
		height: 170px;
	}
}