html,body {
	width: 100%;
	height: 100%
}

body {
	overflow-x: hidden;
	text-align: center;
}

.responsive-padding {
	padding: 3rem 7rem;
}

.sectionWrap {
	max-width: 1500px;
	margin-left: auto;
	margin-right: auto;
	width:100%
}

.heroSection {
	background:url('../images_fa/bg.png');
	background-size: 100% 82%;
	background-repeat: no-repeat;
	background-position: right top;
}

@media only screen and (max-width: 1120px) {
	.heroSection {
		background:url('../images_fa/bg.png');
		background-size: 107% 79%;
		background-repeat: no-repeat;
		background-position: right top;
	}

	.second-section .section-content {
		color: #3A55EA;
	}
}

@media only screen and (max-width: 768px) {

	.second-section .title-img {
		width: 6rem !important;
		height: 6rem !important;
	}

	.friends-container {
		padding:2rem !important
	}

	.friends-container button {
		height: 4rem !important;
	}

	.start-form-card button {
		height: 4rem !important;
	}

	.start-form-card {
		height: auto !important;
		background: #ffffff;
		border-radius: 15px;
		box-shadow: 0px 2px 28px -4px #dadada;
		padding: 2rem !important
	}

	.logo {
		width:5rem;
		height: 4rem;
	}

	.third-section .img-container img {
		width: 60%;
		position: absolute;
	}
}

.logo {
	width:8rem;
	height: 4rem;
}

.hero-btn {
	border-radius: 20px !important;
	height: 3.5rem;
}

.start-btn {
	/* background: #F69631 !important;
	border-color: #F69631 !important */
	background: transparent !important;
	border: 2px solid rgba(255, 255, 255, 1) !important;
	border-radius: 50px !important;
}

.about-btn {
	background: #3A55EA !important
}

.second-section {
	position: relative;
	background:linear-gradient(180deg,#ffffff 50%,#F0F3FF 50%);
	scroll-margin-block: 200px;
}

.second-section .section-content {
	color: #3A55EA;
	min-height: 600px
}

.second-section .title-img {
	width: 10rem;
	height: 10rem;
}

.second-section .title-img-mobile{
	width: 25rem;
	height: 30rem;
}

.title , .p {
	min-height: 50%
}

.third-section {
	background:linear-gradient(180deg,#F0F3FF 30%,#ffffff 30%)
}

.start-form-card {
	height: 40rem;
	background: #ffffff;
	border-radius: 15px;
	box-shadow: 0px 2px 28px -4px #dadada;
	padding: 5rem
}

.text-blue {
	color: #3A55EA
}

.form-title {
	min-height: 50%
}

.form-inputs .form-group {
	height: 60px !important;
	width: 100% !important
}

.form-inputs{
	height: 50%;
}

.form-group input {
	height: 100%;
	border-color: #c4d0f7 !important;
	color: #3A55EA !important
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #3A55EA !important;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #3A55EA !important;
}

::-ms-input-placeholder { /* Microsoft Edge */
	color: #3A55EA !important;
}

.third-section .signUp-btn {
	width: 75%;
	height: 30%;
	border-radius: 20px !important;
	color: white !important;
	background: linear-gradient(267.39deg, #4B63EA -62.97%, #722AB1 158.41%) !important;

}

.third-section .img-container img {
	width: 50%;
}

.third-section .img-container {
	overflow: hidden;
}

.third-section .img-container #first {
	top: 25%;
	left: -5%;
}

.third-section .img-container #second {
	top: 17%;
	right: 1%;
}

.third-section .img-container #third {
	top: 7%;
	left: -5%;
}

.third-section .img-container #fourth {
	top: -16px;
	right: 1%;
}


.friends-container {
	height: 40rem;
	padding: 5rem
}

.third-section .description {
	height: 60%;
	margin-bottom: 2rem
}

.third-section .friends-btn {
	width:75%;
	background: #FD5F6B !important;
	height: 30%;
	border-radius: 20px !important;
	border-color: #FD5F6B !important;
}

.fourth-section {
	background: #F0F3FF;
	position: relative;
	padding-bottom: 10rem !important
}

.fourth-section hr {
	border-color: #3A55EA !important;
	flex: 1
}

.swiper-container {
	min-height: 200px;
}

.commet-img {
	width: 10rem;
	height: 10rem;
	align-self: flex-start
}

.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after , .swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after {
	display: none
}

.friends {
	background:linear-gradient(180deg,#F0F3FF 50%,#ffffff 50%);
	padding: 3rem 2rem;
	position: absolute;
	width: 100%;
	bottom: -8rem;
	left: 0;
}

.friend-card {
	flex: 1;
	height: 8rem;
	border-radius: 15px;
	box-shadow: 0px 2px 28px -4px #dadada;
	background: #ffffff
}

.fifth-section {
	/* z-index: 2; */
}

.download-btn {
	width: 3rem;
	height: 3rem;
	border-radius: 15px;
	box-shadow: 0px 2px 28px -4px #dadada
}

.download-link {
	flex: 1;
}

.gradient-container::after{
	content: '';
	display: block;
	background: linear-gradient(45deg, rgba(114,42,177,1) 44%, rgba(75,99,234,1) 80%) !important;
	width: 100%;
	height: 48%;
	position: absolute;
	bottom: 0;
	z-index: -1000
}

.link {
	color: #ffffff
}

.link:hover {
	text-decoration: none;
	color: #ffffff
}

.footer {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	width: 100%
}

.fifth-section .logo {
	width: 12rem;
	height: 6rem;
}

.fifth-section .icon {
	width: 3rem;
	height: 3rem;
}

.heroSection .button-container {
	width: 50%
}
@media only screen and (max-width: 992px) {
	.download-btn{
		width: 4rem;
		height: 4rem;
		margin-bottom: 1rem
	}
	.navbar {
		padding: 11px 0 !important;
	}
	.navbar-toggler {
		border: 0 !important;
		outline: none !important;
	}
	.second-section .section-content {
		color: #3A55EA;
		min-height: auto;
	}
	.navbar-brand {
		margin-right: 0 !important;
	}
	.heroSection {
		background: url('../images_fa/bg.png');
		background-size: 150% 65%;
		background-repeat: no-repeat;
		background-position: top right 15%;
	}

	.heroSection .button-container {
		width: auto;
	}

	.responsive-padding {
		padding: 3rem 2rem
	}

	/* .fifth-section {
		background:linear-gradient(180deg,#ffffff 70%,#3A55EA 70%);
	} */


	.logo {
		width:6rem;
		height: 4rem;
	}
	.third-section .img-container img {
		width: 50%;
		position: absolute;
	}
}

.friends-container .description {
	height: 50%;
}

@media only screen and (max-width: 1550px) {
	/* .fifth-section {
		background:linear-gradient(180deg,#ffffff 64%,#3A55EA 64%) !important;
	} */
	.start-btn {
		/* background: #F69631 !important; */
		background: linear-gradient(267.39deg, #4B63EA -62.97%, #722AB1 158.41%) !important;
		/* border-color: #F69631 !important; */
		/* background: transparent !important; */
		/* border: 2px solid rgba(255, 255, 255, 1) !important;
		border-radius: 50px !important; */
	}
}


@media only screen and (max-width: 1300px) {
	/* .fifth-section {
		background:linear-gradient(180deg,#ffffff 64%,#3A55EA 64%) !important;
	} */
}

@media only screen and (max-width: 1200px) {
	.responsive-padding {
		padding: 3rem 5rem
	}
	.start-form-card {
		height: 40rem;
		background: #ffffff;
		border-radius: 15px;
		box-shadow: 0px 2px 28px -4px #dadada;
		padding: 3rem
	}

	.friends-container {
		height: 40rem;
		padding: 3rem
	}

	.card-container{
		flex-direction: column;
		align-items: center;
		justify-content: center
	}

	.commet-img {
		width: 10rem;
		height: 10rem;
		align-self: center
	}

	.card-content{
		align-items: center;
		justify-content: center
	}

	.card-content p {
		text-align: center
	}
}

@media only screen and (max-width: 600px) {

	.header{
		padding-right:1rem !important;
		padding-left:1rem !important;
	}

	.responsive-padding {
		padding: 3rem 1rem
	}

	.third-section .friends-btn {
		width:100%;
		background: #FD5F6B !important;
		height: 25%;
		border-radius: 20px !important;
		border-color: #FD5F6B !important;
	}

	.third-section .signUp-btn {
		width: 100%;
		height: 25%;
		border-radius: 20px !important;
		/* background: #3A55EA */
		color: white;
		background: linear-gradient(267.39deg, #4B63EA -62.97%, #722AB1 158.41%);

	}
}

.download-btn-container img{
	height: auto !important;
	width:100% !important
}

@media only screen and (max-width: 768px) {
	/* .fifth-section {
		background:linear-gradient(180deg,#ffffff 80%,#3A55EA 80%);
	} */
	.friends-container {
		height: 40rem;
	}
	.friends-container .description {
		height: auto;
	}
	.second-section .section-content {
		color: #3A55EA;
		min-height: fit-content
	}

	.third-section .img-container #first {
		top: 25%;
		left: 4%;
	}
	
	.third-section .img-container #second {
		top: 17%;
		right: 4%;
	}
	
	.third-section .img-container #third {
		top: 7%;
		left: 4%;
	}
	
	.third-section .img-container #fourth {
		top: -16px;
		right: 4%;
	}
	
}

.gr_btn {
	/* background: linear-gradient(45deg, rgba(114,42,177,1) 22%, rgba(75,99,234,1) 80%) !important; */
	background: white !important;
	border: 2px solid !important;
	border-color: #6e4bea !important;
	border-radius: 50px !important;
}


.download-btn-container img {
	height: 5rem
}

.img-container{
	height: 50%
}

@media only screen and (max-width: 576px) {
	.download-btn-container {
		flex-direction: column
	}

	.img-container{
		height: 40% !important;
	}

	.form-inputs{
		height: auto !important;
	}
	.download-btn-container img{
		height: auto !important;
		width:75% !important
	}

}

.header {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	padding-right: 5rem;
	padding-left: 5rem;
	z-index:10000;
}

.header::after{
	content: '';
	display:block;
	background:linear-gradient(45deg, rgba(114,42,177,1) 22%, rgba(75,99,234,1) 80%) !important;
	border-radius: 0 0 20px 20px;
	width: 100%;
	height: 6rem;
	position: absolute;
	top: 0;
	left:0;
	z-index: -10000;
	opacity: 0;
	transition: .3s ease-out;
}

@media only screen and (min-width:1920px){
	.download-btn-container img{
		height: auto !important;
	}
}

.download-rounded{
	background: transparent !important
}


#section1{
	margin-top: 7rem
}

.updated-class::after{
	opacity: 1;
	transition: .3s ease-out;
}

.download-rounded:hover{
	background: white !important;
	color: blue !important
}
#navbarNavDropdown {
	transition: .3s ease-out;
}
@media only screen and (max-width: 992px) {
	#navbarNavDropdown {
		background: #4b64ec;
		padding: 0 2rem;
	}
	html body .header:after {
		border-radius: 0 !important;
	}
	#navbarNavDropdown.collapse {
		padding: 1rem 2rem 2rem 2rem;
	}
	.navbar-nav {
		padding: 0 0 1rem 0;
	}
	.navbar-nav + .nav-link {
		padding: 0 !important;
	}
	.navbar-nav + .nav-link button {
		width: 100% !important;
	}
	.nav-link {
		text-align: right;
	}
}

@media only screen and (max-width: 600px) {
	#navbarNavDropdown {
		margin: 0 -1rem;
	}
	
	.Download-box {
		width: 100%;
		text-align: center;
		margin-top: -200px;
	}
	.Download-box p {
		text-align: center !important;
	}
}


.about-btn {
    background: #3A55EA !important
}

.heroSection .button-container a {
    display: flex;
    justify-content: center;
    align-items: center;
	color: #fff;
  }


@media only screen and (max-width: 992px) {
	#navbarNavDropdown {
		display: block;
		max-height: 0;
		background: none !important;
		overflow: hidden;
		padding: 0 2rem !important;
		transition: .3s ease-out;
	}
	.navActive .header::after {
		opacity: 1;
		height: 318px;
	}
	.navActive #navbarNavDropdown {
		max-height: 400px;
		padding: 1rem 2rem 2rem 2rem !important;
	}
}