@media only screen and (max-width: 1199px) {
    
}

@media only screen and (max-width: 991px) {
    
}
@media only screen and (max-width: 767px) {
	.join-section{
		min-height: 300px;
	}
	.join-section .content{
		background-color: rgba(0,0,0,0.8);
		padding: 50px;
		color: #fff;
	}
	.join-section h2{
		    font-size: 38px;
    line-height: 40px;
		color: #fff;
	}
	.join-section .btn-p .btn{
		font-size: 25px;
		height: 70px;
		line-height: 50px;
	}
	.join-section{
		padding: 50px;
	}
    .grid li {
	 
	padding: 3px; 
}
	.join-section{
		font-size: 14px;
	}
	
	.navbar-toggle{
		padding-right: 0;
	}
	.main-navbar .navbar-brand{
		display: block;
		font-weight: 700;
		color: #fff;
	}
	.navbar-toggle .icon-bar{
		background: #ffc42c;
		
	}
	.main-navbar .navbar-nav>li>a{
		padding-top: 12px;
		padding-bottom: 12px;
	}
	.logo-div img{
		max-width: 250px;	
		width: 80%;
	}
	
	
.navbar-toggle span {
  display: block; 
	position: relative;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}
 
.navbar-toggle.open span:nth-child(1) {
  top: 6px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

.navbar-toggle.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

.navbar-toggle.open span:nth-child(3) {
  top: -6px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}
 
}
@media only screen and (max-width: 640px) {
	.join-section{
		padding: 0;
	}
    
}
@media only screen and (max-width: 480px) {
	.join-section .content{
		padding:50px 20px;
	}
    .join-section {
    
		min-height: 300px;
}
	.join-section .btn-p .btn {
    font-size: 16px;
    height: 60px;
    line-height: 40px;
}
}
@media only screen and (max-width: 460px) {
	    .grid li {
	 
	padding: 5px;
	width: 50%; 
}
 .grid li:nth-child(4n+1){
	clear: none
}
	.grid li:nth-child(2n+1){
	clear: both
}
    
}