/*hero section*/
@media (min-width: 1920px) {
	.hero {
		margin-top: 8rem;
	}
	.hero__image {
		width: 90%;
		/* height: 10%; */
	}
	.hero__excerpt {
		font-size: 2.1rem;
		line-height: 2.5rem;
	}
	.form-title {
		font-size: 2.1rem;
	}
	.hero__title {
		margin-top: 3.5rem;
		font-size: 3.5rem;
		line-height: 3.5rem;
	}
	.form-and-social-links {
		margin-top: 3rem;
	}
	.subscribe-form {
		/* flex-direction: column; */
		margin-top: 2rem;
	}
	.button-section {
		padding: 1rem 3rem;
	}
	.quiz-main-image {
		width: 90%;
		height: 85%;
		margin-left: 6rem;
	}
	.back-to-quiz-text {
		font-size: 1.8rem;
		margin-left: 1.5rem;
	}
	.coming-soon {
		font-size: 6rem;
	}
	.second {
		padding: 2rem 3.1rem;
	}
}


@media (max-width: 768px) {
	
}
@media (max-width: 1440px) {

	.nav {
		background-color: var(--white-color);
		box-shadow: 0px 10px 20px var(--info-color);
		padding: 1.5rem;
		position: fixed;
		width: 100%;
		top: 0;
		z-index: 1;
	}
	.logo__image {
		/* width: 100%; */
		height: 3rem;
	}
	.hero__image {
		width: 90%;
	}
	.hero__excerpt {
		/* font-size: 2.1rem;
		line-height: 2.5rem; */
	}
	.form-title {
		/* font-size: 2.1rem; */
	}
	.hero__title {
		margin-top: 2.5rem;
	}
	.form-and-social-links {
		margin-top: 2.5rem;
	}
	.subscribe-form {
		/* flex-direction: column; */
		margin-top: 1rem;
	}

	.button-section {
		
		padding: 1rem 2rem;
		font-size: 1.6rem;
	} 
	.back-to-quiz-button {
		padding: 1rem 1.7rem;
		
	}
	.back-to-quiz-text {
		font-size: 1.5rem;
		margin-left: 0.5rem;
	}
}

@media (max-width: 1365px) {
	.hero__image {
		width: 90%;
	}
}
@media (max-width: 1360px) {
	.hero__image--big {
		width: 90%;
	}
}
@media (min-width: 1361px) {
	.hero__image--big {
		width: 90%;
	}
}

@media (max-width: 1308px) {
	.hero__image {
		width: 90%;
	}
}

@media (max-width: 1275px) {
	.hero {
		padding-bottom: 5rem;
	}
	.hero__image {
		width: 90%;
	}
	.signin-cart-wrapper {
		margin-left: 5rem;
	}
	.subscribe-form {
		flex-direction: column;
	}
	.email-input {
		border-radius: 5px;
	}
	.hero__submit-button {
		margin-top: 1rem;
		border-radius: 5px;
	}
	.hero__social-link-items {
		margin-top: 1rem;
	}
	.form-and-social-links {
		margin-top: 1.5rem;
	}
}
@media (max-width: 1212px) {
	.hero__image {
		width: 80%;
	}
}



@media (max-width: 1168px) {
	.hero__image {
		width: 100%;
	}
}



@media (max-width: 1135px) {
	.hero__image {
		width: 100%;
	}
	
}





@media (max-width: 1062px) {
	.hero__image {
		width: 100%;
	}
}

@media (max-width: 1024px) {
	.hero__image {
		width: 100%;
	}
	.hero__title {
		font-size: 3.5rem;
	}
	.hero__excerpt {
		font-size: 1.6rem;
	}
}



@media (max-width: 983px) {
	.hero__image {
		width: 100%;
	}
	/* .coming-soon {
		margin-bottom: 3rem;
	} */
	.hero-flex-wrapper {
		flex-direction: column-reverse;
	}
	.hero__description {
		width: 100%;
		text-align: center;
	}
}



@media (max-width: 950px) {
	.hero__image-wrapper {
		text-align: center;
	}
	.hero__image {
		width: 100%;
	}
}


@media (max-width: 908px) {
	.hero__image {
		width: 100%;
	}
}



@media (max-width: 862px) {
	.hero__image {
		width: 100%;
	}
}



@media (max-width: 830px) {
	.hero__image {
		width: 100%;
	}
	.hero__title {
		font-size: 3rem;
		line-height: 3.5rem;
	}
	.hero__excerpt {
		font-size: 1.6rem;
		line-height: 2.3rem;
		margin-top: 2rem;
	}
}




@media (max-width: 768px) {
	.hero__image-wrapper {
		width: 100%;
		text-align: center;
	}
	.submit-button {
		border-radius: 0.5rem;
	}
	.hero__image {
		width:70%;
	}

	.email-input{
		border-radius:0.5rem;
	}
	.hero__submit-button {
		border-radius:0.5rem;
		margin-top:2rem;
	}
}



@media (max-width: 538px) {
	.hero__excerpt {
		margin-top: 7rem;
	}
	.form-and-social-links {
		margin-top: 2rem;
	}
}
@media (max-width:428px){
	.hero__image {
		width: 100%;
	}
}
@media (max-width: 423px) {
	/* .coming-soon {
		margin-bottom: 3rem;
	} */
}

@media (max-width: 590px) {
	.coming-soon {
		font-size: 4.5rem;
	}
	.hero__title {
		font-size: 1.9rem;
		line-height: 2rem;
		margin-top: 2rem;
	}
}

@media (max-width: 538px) {
	.hero__excerpt {
		margin-top: 2rem;
	}
}



@media (max-width: 428px) {
	.hero__image {
		width: 100%;
	}
}

@media (max-width: 428px) {
	.coming-soon {
		font-size: 4rem;
	}
}

@media (max-width: 346px) {
	.coming-soon {
		font-size: 3.5rem;
	}
}


@media (max-width: 320px) {
	.email-input{
		border-radius:0.5rem;
	}
	.hero__submit-button {
		border-radius:0.5rem;
		margin-top:2rem;
	}
}




/*hero section*/




/*rank section*/

@media (min-width: 1650px) {
	.see-results {
		font-size: 1.9rem;
		margin-left: 2rem;
	}
	.see-results-image {
		display: inline-block;
		margin-left: -1rem;

	}
	.rank-card-text {
		font-size: 2.4rem;
	}
}


@media (max-width:1281px){
	.button-section {
		text-align: center;
	}
	
	.rank-card{
		height:18%;
	}
}

@media (max-width:1168px){
	.rank-section{
		flex-basis:17%;
	}

	.rank-card{
		height:20%;
	}
}
@media (max-width:1091px){
	.form-and-image-wrapper {
		flex-basis: 50%;
	}

	.result-section {
		flex-basis: 35%;
	}
	.quiz-subtitle {
		margin-right: 4rem;
	}
}
@media (max-width:1200px){
	
	.quiz-result-and-rank-wrapper {
		flex-direction: column;
	}
	.back-to-quiz-button {
		display: flex;
		justify-content: center;
		margin-top: 5rem;
		width: 18%;
	}
}

@media (max-width: 786px) {

	.ingredients-section-card {
		flex-basis: 33%;


	}
	.ingredients-section-heading {
		/* flex-basis: 33%; */

	}
	.name-field, .email-field, .submit-button {
		width: 100%;
	}
	.quiz-subtitle {
		margin-right: 2rem;
		text-align: center;
	}

	.rank-section {
		flex-basis: 33%;
	}

	.button-section {
		/* margin-top:2rem; */
		margin-left: 10rem;
		margin-left:0;
	}
	.rank-card {
		margin-top:2rem;
	}
	.back-to-quiz-button {
		width: 22%;
	}

	
}
@media (max-width: 768px) {
	.form {
		flex-direction: column;
		padding-left: 0;
		width: 100%;
	}
	.subtitle-rank-button-wrap {
		margin-top: 0;
	}


	.subtitle-rank-button-wrap {
		flex-direction: column;
	}
	.result-section-wrapper {
		margin-top: 5rem;
	}

  
	.back-to-quiz-button {
		margin-top: 10rem;
		margin-left: 0;
		width: 24%;
		margin: auto;
		/* margin-top: 1rem; */
	}
	
	.quiz-main-image {
		margin-left:5rem;
	}
	.quiz-subtitle {
		font-size: 1.7rem;
	}
  
	.quiz-result-and-rank-wrapper {
		flex-direction: column;
	}

	.progress-report {
		/* margin-top: 5rem; */
	}
}

@media (max-width:752px) {
	.ingredients-section-heading {
		font-size: 1.6rem;
	}
}

@media (max-width: 580px) {
	.quiz-subtitle {
		margin-left: 3rem;
		text-align: center;
	}
}
@media (max-width: 540px) {
	.quiz-subtitle {
		margin-left: 4rem;
		text-align: center;
	}
}
@media (max-width: 396px) {
	.shop__title {
		margin-left: 3rem;
	}
}






@media (max-width: 501px) {
	.ingredients-section-heading {
		/* flex-basis: 33%; */
		font-size: 1.5rem;

	}
}


@media (max-width: 480px) {
	.ingredients-section-heading {
		font-weight: 600;
		font-size: 1.4rem;
	}
	.see-results {
		font-size: 1rem;
	}
	.see-results-image {
		width: 20%;
	}
}

@media (max-width: 439px) {
	.ingredients-section-heading {
		/* flex-basis: 33%; */
		font-size: 1.2rem;
	}
}



@media (max-width: 376px) {
	.ingredients-section-heading {
		/* flex-basis: 33%; */
		font-size: 1.1rem;
	}
}

@media (max-width: 360px) {

	.ingredients-section-heading {
		font-weight: 600;
		font-size: 1rem;
	}
	.form {
		padding-left: 0;
	}
	.see-results {
		font-size: 1rem;
		margin-top: 0.5rem;
		text-align: center;
	}
	.see-results-image {
		width: 20%;
	}
  
  .back-to-quiz-button {
		width: 90%;
	}
}

@media (max-width: 350px) {
	.rank-card-text {
		text-align: center;
	}
}
@media (max-width: 325px) {

	.ingredients-section-heading {
		font-weight: 600;
		font-size: 1rem;
	}
	.see-results {
		font-size: 1rem;
	}
	.see-results-image {
		width: 20%;
	}
}
/*rank section media*/


/* How It Works Section */


@media (max-width: 1061px) {

	.how-it-works__card:nth-child(odd) {
		padding: 6rem 1.5rem;
	}

	/* .how-it-works__card-image {
		width: 5rem;
	} */

}

@media (max-width: 1032px) {

	.how-it-works__video-wrapper::before {
		height: 36%;
	}

	.how-it-works__video-wrapper::after {
		height: 33%;
	}
}

@media (max-width: 947px) {
	.how-it-works__card:nth-child(1) {
		padding: 7.2rem 1.5rem;
	}
}

@media (max-width: 895px) {
	.how-it-works__card:nth-child(2) {
		padding: 6.2rem 1.5rem;
	}

	/* .how-it-works__card-image {
		width: 4rem;
	} */

	/* .how-it-works__bordered {
		width: 10rem;
		height: 10rem;
		top: -10rem;
	}

	.how-it-works__dasshed {
		top: -11rem;
		width: 12rem;
		height: 12rem;
	} */

	.how-it-works__video-wrapper::before {
		height: 33%;
	}

	.how-it-works__video-wrapper::after {
		height: 30%;
	}
}

@media (max-width: 768px) {

	.how-it-works__cards {
		flex-direction: column;
	}

	.how-it-works__card {
		width: 90%;
		margin-bottom: 7rem;
	}

	.how-it-works__video-wrapper::before {
		height: 30%;
	}

	.how-it-works__video-wrapper::after {
		height: 26%;
	}
}	

@media (max-width: 500px) {
	.how-it-works {
		margin-top: 3rem;
	}
	.how-it-works__video {
		margin-top: 2rem;
	}
	.how-it-works__video-wrapper::before {
		height: 22%;
		top: 45%;
	}
	.how-it-works__video-wrapper::after {
		height: 18%;
		top: 45%;
	}
	.wave {
		bottom: -1rem;
	}
}

/*why 3d section*/


@media (max-width: 1308px) {

	.why-plant-milk__our-speciality-item {
		padding: 1rem 3rem;
	}
}


@media (max-width: 1135px) {

	.why-plant-milk__our-speciality-item {
		padding: 1.5rem;
	}
	.why-plant-milk__our-speciality-image {
		width: 3rem;
	}
}



@media (max-width: 895px) {

	.why-plant-milk__image {
		width: 100%;
	}

	.why-plant-milk__our-speciality-image {
		width: 2.3rem;
	}

	.why-plant-milk__our-speciality-text {
		font-size: 0.8rem;
		font-weight: 400;
		margin-left: 1rem;
	}
}

@media (max-width: 847px) {

	.why-plant-milk__our-speciality-item {
		padding: 1rem 2rem;
		width: 32%;
	}

	.why-plant-milk__our-speciality-image {
		width: 2.5rem;
	}
}

@media (max-width: 768px) {

	.why-plant-milk__our-speciality-items {
		flex-direction: column;
	}
	.why-plant-milk__our-speciality-item {
		width: 90%;
	}
	.why-plant-milk__our-speciality-text {
		font-weight: 700;
		margin-left: 2.5rem;
		font-size: 1.6rem;
	}

	.why-plant-milk__button{
		padding:1rem;
		/* font-size: 2rem; */
	}
	.first {
		padding: 1rem 1.2rem;
	}
	.second {
		padding: 1rem 0.25rem;
	}
}
/*why 3d seciton*/







/*shop section*/

@media (max-width: 1024px) {
	.shop__card-title {
		font-size: 2rem;
	}
	.shop__card-desc {
		font-size: 1.5rem;
		line-height: 1.2;
	}
}

@media (max-width: 856px) {
	.shop__title {
		font-size: 3rem;
	}
}

@media (max-width: 768px) {
	.shop-flex-wrapper-1 {
		flex-direction: column;
	}
	.shop-flex-wrapper-2 {
		flex-direction: column-reverse;
	}
	.shop__card-details {
		text-align: center;
	}
	.shop__card-image {
		width: 50%;
	}
	.shop__card-title {
		font-size: 3rem;
	}
	.shop__card-desc {
		font-weight: 500;
	}
}
/*shop section*/





/*footer Section*/
@media (max-width: 1184px) {
	.footer__logo-decs {
		margin-left: 0rem;
		width: 50%;
	}

	.footer__important-links {
		width: 30%;
	}

	.footer__social-links-title {
		margin-top: 3rem;
	}
}

@media (max-width: 970px) {
	.footer__important-links {
		width: 38%;
	}
}



@media (max-width: 768px) {
	.footer__elements {
		flex-direction: column;
		align-items: center;
	}

	.footer__logo-decs {
		width: 100%;
	}

	.footer__important-links {
		width: 100%;
		margin-top: 3rem;
	}

	.footer__social-links {
		width: 100%;
	}

	.secondary-footer {
		margin-top: 5rem !important;
		padding: 1rem;
		position: relative;
	}

	.secondary-footer__copy-right-text {
		margin-top: 2rem;
	}

	.secondary-footer__moto {
		margin-top: 6.5rem;
	}


}

@media (max-width: 613px){
	.secondary-footer__copy-right-text {
		float: left;
		margin-top: 2rem;
	}
}

@media (max-width:360px){
	.footer__social-link-item:nth-child(1) img {
		/* margin-left: 0; */
		width:2.5rem;
		height:2.5rem;
	}
	.footer__social-link-item {
		padding: 0.9rem 0.7rem;
		width: 3.5rem;
		height: 3.5rem;
	}
	.footer__social-link-item img {
		margin-left: 0;
		width:1.5rem;
	}
	
	.footer__social-link-item:nth-child(1) img{
		width:1rem;
	}

	.secondary-footer__copy-right-text {
		float: left;
		margin-top: 2rem;
	}

	
	
}


@media (max-width: 340px) {
	.footer__social-link-item {
		width: 4rem;
		height: 4rem;
	}
}

@media (max-width: 325px) {
	.footer__social-link-item {
		width: 3rem;
		height: 3rem;
	}
}


/*footer section*/




/* Mobile Versions */

@media (max-width: 425px) {
	.how-it-works__title {
		font-size: 2.5rem;
	}
	.how-it-works__cards {
		margin-top: 8rem;
	}
	.shop__title {
		font-size: 2.5rem;
	}
	.why-plant-milk__title {
		font-size: 2.5rem;
	}
	.quiz {
		margin-top: 0;
	}
	.quiz-subtitle {
		/* margin-left: 4rem; */
		text-align: center;
		font-size: 1.6rem;
		margin-left: -1.5rem;
	}
	.quiz-main-image {
		margin-left: 0;
	}
	.back-to-quiz-button {
		width: 40%;
	}
	.back-to-quiz-text {
		font-size: 1.2rem;
	}
	.quiz-image-subtitle-wrapper {
		margin-left: 1.5rem;
	}
	.why-plant-milk__subtitle {
		font-size: 1.6rem;
	}
	.shop {
		padding-top: 5rem;
		padding-bottom: 5rem;
	}
	.shop__title {
		margin-left: 0;
	}
	.shop__card-title {
		font-size: 2rem;
	}
	.footer {
		padding-top: 4rem;
	}
	.footer__logo {
		width: 40%;
	}
	.secondary-footer {
		margin-top: 3rem !important;
	}
	.secondary-footer__moto {
		margin-top: 5rem;
	}
	.why-plant-milk__title {
		padding-top: 3rem
	}
}

@media (max-width: 330px) {
	.shop__title {
		font-size: 2rem;
		
	}
	.why-plant-milk__title {
		font-size: 2rem;
	}
	.why-plant-milk__subtitle {
		font-size: 1.4rem;
	}
	.secondary-footer__copy-right-text {
		font-size: 1.4rem;
	}
	.secondary-footer__moto {
		font-size: 1.4rem;
	}
}

