@media(max-width: 600px){
	.padding{
		padding: 80px 40px;
	}

	.row{
		flex-direction: column;
	}
	.row .col50{
		width: 100%;
	}
	.row .col50{
		padding-right: 00px;
	}
	.row .col25{
		width: 100%;
	}
	.row .col33{
		width: 100%;
	}
	.row .col40{
		width: 100%;
	}
	.row .col60{
		width: 100%;
	}


	/*HERO CONTENT*/
	.heroContent{
		padding: 20px;
	}
	.heroContent .title{
		font-size: 2.5rem;
		font-weight: 600;
		width: 100%;
	}
	.heroContent .title .date{
		font-size: 1.2rem;
	}
	
	/*NAVIGATIONBAR*/
	nav{
		padding: 0;
		background-color: #a7c957;
		z-index: 9999;
	}
	nav .logo{
		font-size: 28px;
		padding-left: 10px;
	}
	nav ul{
		float: none;
		height: 100vh;
		width: 100%;
		background-color: #a7c957;
		margin-top: 70px;
		margin-left: -100%;
		transition: 0.3s;
		z-index: 9999;
	}
	nav ul li{
		display: block;
		padding: 0 10px;
		height: 50px;
		text-align: center;
	}
	nav ul li a{
		text-decoration: none;
		color: #000;
		transition: 0.5s;
		text-transform: uppercase;
		font-size: 14px;
	}
	nav.nav2{
		background: #a7c957;
	}
	nav.nav2 ul li a{
		color: #fff;
	}
	.toggleIcon{
		display: block;
		width: 40px;
		height: 40px;
		background-color: inherit;
		float: right;
		position: relative;
		right: 10px;
		top: 50%;
		transform: translateY(-50%);
		cursor: pointer;
	}
	.toggleIcon span{
		position: absolute;
		width: 100%;
		height: 2px;
		background-color: #fff;
		top: 50%;
		transform: translateY(-50%);
		transition: 0.3
	}
	.toggleIcon span:before{
		position: absolute;
		content: "";
		left: 0;
		width: 100%;
		height: 100%;
		top: -10px;
		background-color: inherit;
		transition: 0.3s
	}
	.toggleIcon span:after{
		position: absolute;
		content: "";
		left: 0;
		width: 100%;
		height: 100%;
		bottom: -10px;
		background-color: inherit;
		transition: 0.3s
	}
	.toggleIcon.hamburger span{
		background-color: #a7c957;
	}
	.toggleIcon.hamburger span:before{
		transform: rotate(45deg);
		opacity: 1;
		background-color: #000;
		top: 0px;
	}
	.toggleIcon.hamburger span:after{
		transform: rotate(-45deg);
		opacity: 1;
		background-color: #000;
		bottom: 0;
	}
	.slideNav{
		margin-left: 0
	}

	/*MODULES*/
	.column{
		column-count: 1;
	}

	.footer{
		min-height: 100px;
		padding: 50px 10px;
		background: #000;
	}

	/*REGISTER*/
	.register .col50:second-child p{

	}

	.courseInfo .row .col30{
		width: 100%;
	}
	.courseInfo .row .col30 div{
		background: #81b29a;
		padding: 20px;
		border-radius: 25px;
		font-size: 3rem;
		color: #fff;
		font-weight: 800
	}
	.courseInfo .row .col70{
		padding-left: 20px;
		width: 100%;
		margin-top: 20px;
	}

	.faculty h1 span:before{
		width: 20px;
		top: 70%;
		left: -10%
	}
	.faculty h1 span:after{
		width: 20px;
		top: 70%;
		right: -10%
	}
	.faculty .row .col50{
		padding-right: 20px;
		padding-left: 20px;
	}
	.faculty .row .col50:nth-child(2){
		margin-top: 50px;
	}

	.register .row .col50:nth-child(1):after{
		position: absolute;
		content: '';
		width: 0px;
		height: 100%;
		background: #ddd;
		top: 20px;
		right: 0;
		border-radius: 15px;
	}
	.register .row .col50:nth-child(2){
		padding-left: 00px
	}

}