/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 @import url('https://fonts.googleapis.com/css?family=Comfortaa');
 @import url('https://fonts.googleapis.com/css?family=Open+Sans');

 .premo-content .premo-error {
    text-align: center;
    font-family: 'Comfortaa', cursive;
    padding-right: 10px;
    margin-top: 10px;
    background-color: #fbf7d6;
    border: #e8e0a2 solid thin;
    padding: 5px;
    border-radius: 4px;
}

.premo-content .premo-error p {
    margin: 0;
    font-size: 14px;
    text-align: center;
}

.premo-ajax .premo-error,
.premo-ajax .premo-post-content {
    display: none;
}

.premo-ajax .premo-gate {
    visibility: hidden;
}

.premo-ajax.premo-ajax-loading {
    width: 100%;
    height: 50px;
    background-image: url(ajax-loader.gif);
    background-repeat: no-repeat;
    background-position: center center;
    display: inline-block;
}

#pl-styles.premo-gate {
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 2px 4px 0 rgba(82,97,115,0.2);
    border: solid thin rgba(82,97,115,0.1);
    text-align: center;
    font-family: 'Comfortaa', cursive;
    padding: 32px;
}

#pl-styles.premo-gate .pl-title {
    color: #3A6AC5;
    font-size: 24px;
    margin-bottom: 20px;
}

#pl-styles.premo-gate p {
    color: #021E3A;
    font-size: 14px;
    margin-bottom: 20px;
    text-align: center;
}

#pl-styles.premo-gate .pl-btn {
    font-family: 'Open Sans', sans-serif;
    color: #fff;
    font-size: 14px;
    text-transform: uppercase;
    border-radius: 100px;
    padding: 14px 32px;
    display: inline-block;
    background-color: #00C38F;
    box-shadow: none;
    border: none;
}
#pl-styles.premo-gate .pl-btn:hover,
#pl-styles.premo-gate .pl-btn:focus,
#pl-styles.premo-gate .pl-btn:active {
    background: #00b988;
    text-decoration: none;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
}

#pl-styles.premo-gate .premo-twitter-oauth::before {
    content: "";
    display: inline-block;
    background-image: url(twitter.png);
    width: 20px;
    height: 22px;
    background-repeat: no-repeat;
    margin-right: 15px;
    margin-bottom: -8px;
}

#pl-styles.premo-gate .pl-pb {
    color: #94A2B4;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
}

#pl-styles.premo-gate .pl-pb::after {
    content: '';
    display: inline-block;
    width: 126px;
    height: 40px;
    background-image: url(premo-logo.jpg);
    background-repeat: no-repeat;
}

#pl-styles.premo-gate .pl-loading {
    width: 26px;
    height: 16px;
    background-image: url(ajax-loader.gif);
    background-repeat: no-repeat;
    margin-right: -26px;
    background-position: right center;
    display: inline-block;
}

.premo-content {
    margin-bottom: 20px;
}

.premo-content.enabled-content {
    border: #2beac9 solid thin;
    padding: 0 20px 20px;
    border-radius: 3px;
}

.premo-content.enabled-content::after {
    content: "Powered by ";
    font-family: 'Comfortaa', cursive;
    background-image: url(premo-logo.jpg);
    width: 175px;
    height: 25px;
    background-repeat: no-repeat;
    background-position: 75px center;
    display: flex;
    align-items: center;
    font-size: 13px;
    background-size: 100px;
    margin-top: 20px;
}

.premo-content.enabled-content.excerpt {
    border: none;
    padding: 0;
    margin-bottom: 0;
    border-radius: 0;
}

.premo-content.enabled-content.excerpt::after {
    margin-bottom: 10px;
}