/*
|----------------------------------------------------------------------------
	ALanding - Responsive Multipurpose Landing Page Template
	Author: MGScoder
	Author URL: https://themeforest.net/user/mgscoder
|----------------------------------------------------------------------------
*/
@media screen and (max-width: 991px) {
	nav.navbar.mgsbsnavbar .navbar-nav a.nav-link, 
	.mgsfixed-nav .main-menu .navbar-nav li a,
	.mgsfixed-nav nav.navbar.mgsbsnavbar .navbar-nav a.nav-link {
		padding: 15px;
	}
	nav.navbar.mgsbsnavbar .navbar-nav a.nav-link {
		color: #000;
	}
	.navbar-collapse {	
		background-color: #f2f2f2;
		width:200px;
		float:right;
	}
	.navbar-fixed-top .navbar-collapse {
		max-height: auto;
	}
	.navbar-collapse ul.nav.navbar-nav {	
		margin-bottom: 0;
	}
	.navbar-collapse ul li {	
		border-bottom: 1px solid #c5c5c5;
	}
	.main-menu .navbar-nav li a {
		color: #000;
	}
	.navbar-collapse ul.nav.navbar-nav li:hover a, .navbar-collapse ul.nav.navbar-nav li a:hover {
		color: #fff;
	}
	.navbar-nav {
		margin-top: 0;
	}
	.nav.navbar-nav.navbar-right > li > a, .mgsfixed-nav .nav.navbar-nav.navbar-right > li > a {
		padding-bottom: 7px;
		padding-left: 15px;
		padding-top: 10px;;
	}
	.navbar-toggle {
		margin: 20px 0 0;
	}
	.mgsfixed-nav .navbar-toggle {
		margin: 8px 0 0;
	}
	
	.main-menu .navbar-nav li a {
		padding: 30px 12px;
	}
	.mgsfixed-nav .main-menu .navbar-nav li a {
		padding: 18px 12px;
	}
	#home .home-top-banner .col-sm-8 {
		width: 100%;
	}
	
	#features .feature-item-box .col-sm-4 {
		width: 50%;
		right: 0;
	}
		
	#about-area .about-box, #experience-area .experience-box, #design-area .modern-design-box {
		padding-left: 5%;
		padding-right: 5%;
	}
	
	#features .feature-icon, #features .right-box .feature-icon {
		left: auto;
		margin: 0 0 20px;
		position: relative;
		right: auto;
		top: 0;
	}
	#FAQ .col-sm-push-4 {
		left: 0;
	}
	#FAQ .col-sm-pull-8 {
		right: 0;
	}
}
@media screen and (max-width: 767px) {
	.parallax, .home-top-banner {
		background-attachment: scroll;
	}
	.image-holder {
		margin: 0 0 60px;
	}
	#design-area .title-wrap {
		text-align: center;
	}
	#design-area .title-wrap h2::before {
		left: 50%;
		margin-left: -25px;
	}
	.col-sm-show {
		display: block;
	}
	.col-sm-hidden {
		display: none;
	}
	#about-area .feature-details, #features .feature-details, #experience-area .feature-details {
		max-width: 560px;
		margin: 20px auto 0;
	}
		
	#features .image-holder {
		margin-top: 0;
		margin-bottom: 40px;
	}
	#about-area .image-holder, #about-area .columnbottommargin.image-holder, #experience-area .image-holder, #design-area .image-holder {
		margin-bottom: 40px;
	}
	#design-area .columnbottommargin {
		margin-bottom: 40px;
	}
	#design-area .columnbottommargin.image-holder {
		margin-bottom: 60px;
	}
	#FAQ .query-contact {
		margin-bottom: 0;
	}
	#about-area .columnbottommargin {
		margin-bottom: 60px;
	}
		
	#pricing .pricing-plan-header > h3 {
		font-size: 20px;
	}
}
@media screen and (max-width: 575px) {
	.our-team .col-sm-3,
	.success-story .col-sm-3 {
		width: 100%
	}
	.panel-default > .panel-heading i.indicator.glyphicon {
		top: 3px;
	}
	#about-area .about-box, #design-area .modern-design-box, #experience-area .experience-box {
		padding-left: 0;
		padding-right: 0;
	}
	#FAQ .panel-group .panel-body {
		padding: 30px;
	}
	#pricing .pricing-plan-header > h3 {
		font-size: 28px;
	}
}	
@media screen and (max-width: 480px) {
	.post-navigation .col-xs-6 {
		width: 50%;
	}
	#contactForm {
		padding: 0;
	}
	.contact-details {
		padding: 0;
	}
}
@media screen and (max-width: 420px) {
	.btn.btn-store {
		min-width: 180px;
		padding: 10px;
	}
	.button-holder .btn.btn-custom.btn-store {
		margin: 10px 5px 5px 0;
	}
	.banner-content h3 {
		font-size: 22px;
	}
	.banner-content h2.type-animate a.typewrite {
		font-size: 36px;
	}
}	
@media screen and (max-width: 360px) {
	.banner-content h1.header-title-text {
		font-size: 38px;
	}
	.banner-content h2.type-animate a.typewrite {
		font-size: 32px;
	}
}	
@media screen and (max-width: 320px) {
	.nav-container {
		height: 60px;
	}
	.navbar-brand .logo {
		height: 60px;
	}
	.navbar-toggle {
		margin: 10px 0 0;
	}
	.home-top-banner .banner-content {
		margin-top: 60px;
	}
	.banner-content h1.header-title-text {
		font-size: 36px;
	}
	.banner-content h2.type-animate a.typewrite {
		font-size: 30px;
	}
	.banner-content h3 {
		font-size: 20px;
	}
}	
@media screen and (max-width: 300px) {
	.banner-content h2.type-animate a.typewrite {
		font-size: 28px;
	}
}
@media screen and (max-height: 420px) {
	.navbar-fixed-top .navbar-collapse {
		max-height: 270px;
	}
}
@media screen and (max-height: 360px) {
	.navbar-fixed-top .navbar-collapse {
		max-height: 240px;
	}
}
@media screen and (max-height: 320px) {
	.navbar-fixed-top .navbar-collapse {
		max-height: 200px;
	}
}