
@media (min-width: 1200px){
	.container, .container-lg, .container-md, .container-sm, .container-xl {
		max-width: 1200px !important;
	}
}

@media (max-width: 1024px){
	.title-section p{
		width: 100%;
	}

	.more-logo{
		height: auto;
	}

	.brand-card img{
		object-fit: contain;
	}
	#dashboard-right,
	#dashboard-left{
		height: 560px;
		padding: 40px 0px;
	}

	#dashboard-left{
		background-image: url(../images/shapes-left.png);
		background-size: 2000px;
		background-repeat: no-repeat;
		background-position: right;
		background-position-y: 20px;
		background-position-x: -500px;

	}
	#dashboard-right{
		background-image: url(../images/shapes-right.png);
		background-size: 2000px;
		background-repeat: no-repeat;
		background-position: right;
		background-position-y: 20px;
		background-position-x: -500px;
	}
	.right-content .image-dashboard,
	.left-content .image-dashboard{
		padding-top: 64px;
	}

	#feature .title-section h2,
	#feature .title-section p{
		text-align: left;
	}

	.help{
		width: 100%;
		height: 320px;
		background: url(../images/bg-help.png);
		background-size: cover;
		background-repeat: no-repeat;
		box-shadow: 0 30px 60px 0 rgba(0,0,0,0.09);
		border-radius: 20px;
		overflow: hidden;

	}
	.desc-help {
		width: 60%;
		margin-top: 6%;
		padding-right: 102px;
	}
	@media (min-width: 1024px){
		.more-logo{
			height: 100px !important;
		}
		header{
			height: 768px;
		}
		.hero-image{
			padding-top: 40px;
		}
	}
	@media (max-width: 768px){
		header{
			height: auto;
			padding-bottom: 40px;
		}
		.navbar-light .navbar-toggler img{
			width: 24px;
			height: 24px;
		}
		.navbar-light .navbar-nav .nav-link {
			color: rgba(0,0,0,.5) !important;
		}
		.navbar-collapse{
			width: 100%;
			background: #fff;
		}
		.navbar-light .navbar-nav .nav-link {
			color: rgba(0,0,0,.5) !important;
		}
		.navbar-collapse{
			background: #fff;
		}
		#navbar-normal.navbar{
			position: fixed;
			width: 100%;
		}
		#navbar-white.navbar{
			visibility: visible;
			height: 74px;
			margin-top: -74px;
			display: none;
		}
		#navbar-white .navbar-brand img{
			width: 40px;
			height: 40px;
		}
		.hero-header{
			margin-top: 180px;
			text-align: center;
		}
		.hero-header h1{
			font-size: 40px;
			margin-bottom: 24px;
		}
		.hero-header p{
			font-size: 18px;
			margin-bottom: 24px;
		}


		#sites{
			height: auto;
			padding: 40px 0px;
		}
		.container-sites{
			top: 0;
			padding: 80px 24px;
		}
		.logo-sites{
			width: 100%;
			height: 40px;
			margin-bottom: 16px;
		}

		.title-section{
			width: 80%;
		}
		.title-section h2{
			font-size: 32px;
			line-height: 42px;
			margin-bottom: 24px;
		}
		.title-section p{
			font-size: 16px; 
			line-height: 26px;
		}

		.features-card{
			text-align: center;
		}

		#analytics .title-section{
			width: 80%;
			margin-top: 0;
		}
		#analytics .title-section h2{
			text-align: center !important;
		}
		#analytics .title-section p{
			text-align: center !important;
		}

		#analytics, #features, #dashboard, #faq {
			width: 100%;
			padding: 80px 0px 0px 0px;
		}
		.divider{
			margin-top: 80px;
		}
		footer{
			margin-top: 80px;
		}
		footer .buy-footer{
			padding-top: 80px;
		}
		footer .buy-footer h2{
			font-size: 24px;
			line-height: 34px;
			text-align: center;
		}
		footer .buy-footer a{
			margin-top: 10px;
			width: 100%;
			text-align: center;
			display: block;
		}
		footer .info-footer{
			padding: 40px 0px;
		}
		footer .info-footer p, footer .info-footer{
			width: 100%;
			text-align: center;
		}
		footer .subscribe{
			margin-top: 16px;
		}
		footer .subscribe .box-input{
			display: block;
		}
		footer .subscribe .box-input input{
			height: 48px;
			text-align: center;
		}
		footer .subscribe .box-input a{
			margin-top: 16px;
			text-align: center;
		}
		footer .subscribe .box-input img{
			display: none;
		}
		footer .subscribe .box-input a, footer .subscribe .box-input input{
			width: 100%;
			display: block;
		}
		footer p.copyright, footer .copyright-link{
			text-align:  center !important;
		}
		footer .copyright{
			padding-bottom: 0;
		}
		footer .copyright-link{
			margin-bottom: 40px;
		}
	}
	@media (max-width: 767px){
		header{
			height: auto;
		}
		.hero-header{
			text-align: center;
		}
		.hero-header h1{
			margin-bottom: 16px;
		}
		.modal-body ul{
			text-align: center;
		}
		.btn-nav{
			padding: 8px 16px;
		}

		#sites{
			height: auto;
			padding-bottom: 0px;
		}
		.container-sites{
			padding: 40px 16px;
		}
		.title-section{
			width: 100%;
		}
		.title-section h2{
			font-size: 24px;
			line-height: 34px;
			margin-bottom: 8px;
		}
		.title-section p{
			font-size: 16px;
			line-height: 26px;
		}

		.accordion > .card:not(:last-of-type){
			margin-bottom: 16px;
		}


		.help .btn-custom{
			padding: 8px 16px;
		}
		.help .btn-white{
			font-size: 14px;
		}

		#bg-header{
			background-size: cover;
			height: auto;
		}
		.hero-header{
			width: 100%;
			margin-top: 40%;
		}
		.hero-header > h1{
			font-size: 24px;	
		}
		.hero-header > p{
			font-size: 14px;
			line-height: inherit;
		}

		.img-header{
			z-index: 0;
			left: 0;
			float: left;
			width: 100%;
			display: block;
			margin-top: 10px;
		}
		.img-header-mobile{
			float: left;
			width: 100%;
			display: block;
			background-repeat: no-repeat;
			background-size: cover;
			top: 10px;
		}

		.title-section {
			margin-bottom: 0 !important;
		}
		.title-section p{
			width: 100%;
			margin-bottom: 40px;
			line-height: inherit;
		}

		#feature{
			padding: 40px 0px;
		}
		.feature-check, .panel{
			margin-bottom: 16px;
		}


		h5.mb-0{
			font-family: Inter-Bold;
			font-size: 16px;
			padding-right: 24px;
		}
		h5.mb-0 i{
			position: absolute;
			right: 16px;
			top: 24px;
		}



	}

	@media (max-width: 767px){
		.img-header{
			top: 0px;
		}

	}



	@media (max-width: 475px){
		.help {
			background-size: cover;
			background-repeat: no-repeat;
			height: 150px;
		}
		.desc-help {
			margin-top: 4%;
		}
		.desc-help h2 {
			font-size: 22px;
			line-height: inherit;
			margin-bottom: 16px;
		}
	}

	@media (max-width: 320px){
		#dashboard-right {
			height: auto;
			padding: 40px 0px;
			background-size: 1200px;
			background-repeat: no-repeat;
			background-position: top right;
			background-position-y: 50px;
			background-position-x: -580px;
		}
		#dashboard-left {
			height: auto;
			padding: 40px 0px;
			background-size: 1200px;
			background-repeat: no-repeat;
			background-position: top left;
			background-position-y: 60px;
			background-position-x: -240px;
		}
	}