/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Feb 3, 2018, 1:36:36 AM
    Author     : Pranata
*/

.newsletter-message {
    width: 50%;
    height: auto;
    top: 30%;
    clear: both;
    margin: auto;
    left: 25%;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    /* margin: 3em auto 0; */
    background: #fff;
    padding: 3em 3em 3em 6em;
    position: fixed;
    z-index: 999;
    /*    width: 35%;
        border-radius: 10px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        margin: 3em auto 0;
        background: #fff;
        padding: 3em 3em 3em 6em;
        position: relative;*/
}
p.newsl-letter {
    height: auto;
    font-size: 14px;
    color: #C0BEBE;
    padding-bottom: 1em;
    line-height: 1.8em;
}
.newsletter-image {
    position: absolute;
    top: 16%;
    left: -56px;
}
.newsletter-box {
    /*padding-top: 2em;*/
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    top: 0px;
    position: fixed;
    z-index: 999;
    /* opacity: 0.8; */
    /* padding-top: 2em; */
    /*background: #b4b4b4a3;*/
    background: rgba(41, 40, 40, 0.5882352941176471);
}

.newsletter-message .newsletter-message-close{
    right: -24px;
    top: -13px;
    position: absolute;
    text-align: center;
    width: 20px;
    background: #f54848;
    border-radius: 15px;
    cursor: pointer;
}
.button-bottom {
    width: 100%;
    margin: 0 auto;
}
.newsletter-message input[type="text"]:nth-child(2) {
    margin-right: 0;
}
.newsletter-message input[type="text"]{
    width:40%;
    padding: 15px;
    font-size:1em;
    border:1px solid #DBDBDB;
    outline:none;
    margin: 0 0 1em;
    background:#f8fafa;
    -webkit-appearance:none;
    color: #999;
    margin-right: 2.7em;
}
.newsletter-message input.incsub-mailchimp-field:hover{
    border:1px solid #5fb1ea;
}
.newsletter-message input[type="checkbox"] {
    float: left;
    margin: 5px 15px 0 5px;
    cursor: pointer;
    display: inline-block;
}
p.news {
    color: #B4B4B4;
    display: inline-block;
}
span.tick {
}
.button {
    float: right;
}
.button input[type="submit"]{
    background: url(../images/tick.png) no-repeat 9px 9px #5FB1EA;
    padding: .6em .6em .6em 2em;
    outline: none;
    border: none;
    font-size: 18px;
    border-radius: 0.3em;
    -webkit-border-radius: 0.3em;
    -moz-border-radius: 0.3em;
    cursor: pointer;
    color: #fff;
}
.button input[type="submit"]:hover{
    background: url(../images/tick.png) no-repeat 9px 9px #55396C;
    transition:0.5s all;
}
.check-box {
    float: left;
    margin-top: 1em;
}
/*--copyrights--*/
.copy-right{
    text-align: center;
    margin-top: 10em;
}
.copy-right p{
    color:#FFF;
    font-size: 1em;
    line-height:1.8em;
}
.copy-right p a{
    color:#fff;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    text-decoration:none;
}
.copy-right p a:hover{
    color:#5FB1EA;
    text-decoration:none;
}
/*--/copyrights--*/
/*--media Queries--*/
@media(max-width:1680px) and (min-width:1024px){
    .newsletter-message  input[type="text"]{
        width: 49%;
        margin-right: 0.2em;
    }
}

@media(max-width:1024px) and (min-width:767px){
    .newsletter-message {
        /*width: 44%;*/
        width: 75%;
        left: 12.5%;
    }
    .newsletter-message  input[type="text"]{
        width: 49%;
        margin-right: 0.2em;
    }
    h1 {
        padding-top: 2em;
    }
    .copy-right {
        margin: 4.39em 0;
    }
}

@media(min-width:220px) and (max-width:768px){
    h1 {
        font-size: 20px;
        padding-top: 3em;
    }
    h2 {
        font-size: 14px;
    }
    .newsletter-message {
        padding: 2em 1em 1em 1em;
        width: 84%;
        left: 8%;
        top: 25%;
    }
    .newsletter-message .newsletter-message-close {
        right: -18px;
        top: -14px;
    }
    p.newsl-letter {
        line-height: 1.5em;
        overflow: hidden;
        /*height: 27px;*/
        margin-bottom: 1em;
        font-size: 13px;
    }

    .newsletter-image img {
        width: 50%;
    }
    .newsletter-message input[type="text"] {
        width: 36%;
        padding: 8px;
        font-size: 11px;
    }
    .newsletter-image {
        top: -12%;
        left: 41%;
        width: 120px;
    }
    p.news {
        font-size: 11px;
    }
    .check-box {
        margin-top: 4px;
    }
    .newsletter-message  input[type="checkbox"] {
        margin: 7px 4px 0 0px;
    }
    .button input[type="submit"] {
        font-size: 13px;
        background-size: 16%;
    }
    .button input[type="submit"]:hover {
        background-size: 16%;
    }
    .newsletter-message  input[type="text"] {
        width: 100%;
        padding: 8px;
        font-size: 11px;
    }
    .copy-right {
        margin: 3em 0 2em;
    }
    .button-bottom {
        margin: 3% auto;
    }
}


/*--/media Queries--*/


/*@media(max-width:480px){
    h1 {
        font-size: 1em;
    }
    h2 {
        font-size: 1.2em;
    }
    p.newsl-letter {
        line-height: 1.5em;
        overflow: hidden;
        height: 33px;
        margin-bottom: 1em;
    }
    .newsletter-message input[type="text"] {
        width: 41%;
        padding: 10px;
        font-size: 13px;
    }
    .newsletter-image {
        top: 14%;
        left: -40px;
    }
    .button input[type="submit"] {
        font-size: 15px;
        background-size: 16%;
    }
    .copy-right {
        margin: 12em 0;
    }
}*/

/*
@media(max-width:1440px){
    .newsletter-message   input[type="text"] {
        width: 42.7%;
        margin-right: 0.2em;
    }
}
@media(max-width:1366px){
    .newsletter-message    input[type="text"] {
        width: 49%;
    }
}
@media(max-width:1280px){
    .newsletter-message  input[type="text"] {
        width: 41.8%;
    }
}*/

/*@media(max-width:768px){
    h1 {
        font-size: 2em;
        padding-top: 6em;
    }
    .newsletter-message {
        width: 60%;
        width: 75%;
        left: 12%;
    }
    .newsletter-message  input[type="text"] {
        width: 42%;
    }
    .copy-right {
        margin: 9.2em 0;
    }
}
@media(max-width:640px){
    h1 {
        font-size: 1.5em;
    }
    h2 {
        font-size: 1.5em;
    }
    p.newsl-letter {
        line-height: 1.5em;
    }
    .newsletter-image img {
        width: 70%;
    }
    .newsletter-message  input[type="text"] {
        width: 40.4%;
    }
    .newsletter-message {
        padding: 2em 2em 2em 3em;
    }
    .newsletter-image {
        top: 12%;
        left: -42px;
    }
    p.news {
        font-size: 13px;
    }
    .newsletter-message  input[type="checkbox"] {
        margin: 5px 8px 0 5px;
    }
    .check-box {
        margin-top: 8px;
    }
    .copy-right {
        margin: 10em 0;
    }
}*/