#newsletter {

	@media(max-width: 768px) {
		padding: 40px 30px;
	}

    .section-heading {
        margin-bottom: 30px;

		 @media( max-width: 991px) {
			 text-align: center;
			 margin-bottom: 40px;
		 }

        .section-title {
            color: #fff;
            font-size: 45px;
            margin-bottom: 10px;

            @media( max-width: 991px) {
                font-size: 30px;
            }
        }

        .subtitle {
            font-size: 18px;
            color: #fff;
            margin-bottom: 20px;
            font-weight: 400;
        }

        @media(max-width: 768px) {
            text-align: center;
            margin-bottom: 40px;
        }
    }
}

  
.newsletter-form {
    max-width: 600px;
    margin: 0 auto;

    .newsletter-inner {
        display: flex;      
        border-radius: 30px;
        padding: 5px;

        @media(max-width: 440px) {
            display: block;
        }
    }

    .form-result {   
        margin: 20px 5px 0;
    }

    input:not([type='checkbox']):not([type='submit']) { 
        border-radius: 5px;
        padding: 17px 25px;
        line-height: 19px;
        font-size: 16px;
        height: 54px;
        flex: 1;
        background: transparent;
        border: 2px solid rgba(255, 255, 255, 0.302);
        color: #fff;
        margin: 0 10px 0 0;

        &::placeholder {
            color: rgba(255, 255, 255, 0.7);
        }

        &:focus {
            border-color: #fff;
            box-shadow: none;
        }

        @media(max-width: 440px) {
            margin-bottom: 15px;
        }
    }

    .newsletter-submit {
        font-size: 15px;
        font-weight: 500;
        text-transform: uppercase;
        height: 54px;
        border: 1px solid $color__theme;  
        padding: 0 30px;
        border-radius: 5px;
        outline: 0;
        min-width: 150px;

        @media(max-width: 440px) {
            width: 100%;
        }
        
        &:hover {
            color: #fff;
            border-color: #fff;
        }

        .fa-spin {
            display: none;
        }

        &.clicked {
            .fa-spin {
                display: block;
            }

            span {
                display: none;
            }
        }
    }
}

.newsletter-2 {
    form {
        button {
            &.payment-btn {
                background: linear-gradient(96.49deg, #0082f8 0%, #3c10f2 101.82%);
            }
        }
    }
}

.digi_seo_area {
    .seo_subscribe_form {
        .digi-form {
            .form-control {
                margin-bottom: 0;
                background: #ffffff;
                border-radius: 50px;
                height: 52px;
                border: 0;
            }
            .digi-button {
                position: absolute;
                right: 0;
                top: 0;
                background: #ff3951;
                border-radius: 0 50px 50px 0;
                padding: 16px 20px;
                font-size: 14px;
                font-weight: 600;
                border: 0;
                display: inline-block;
                color: #fff;
            }
        }
    }
}