.comment-heading {
    margin-top: 30px;
    color: #2D83C1;
    font-size: 22px;
    font-weight:700;
}

.comment-form{
    background-color: #e9e9e9;
    width: 100%;
    border-radius: 5px;
    margin-top: 20px;
    padding: 20px;
    float: left;
    box-shadow: 1px 2px 3px rgba(0,0,0,0.2);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.comment-form input{
    width: 250px;
    background: #fff;
    border-radius: 5px;
    padding: 10px 20px;
    border: 0;
    /* float: left; */
    clear: both;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.comment-form input.error{
    background-color: #f3c2c2;
}

.comment-form textarea{
    width: 100%;
    height: 100px;
    background: #fff;
    border-radius: 5px;
    padding: 10px 20px;
    border: 0;
    /* float: left; */
    clear: both;
    resize: vertical;
    margin-top: 20px;
    font-family: 'Open Sans', sans-serif;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.comment-form textarea.error{
    background-color: #f3c2c2;
}

.comment-submit{
    width: 170px;
    height: 45px;
    float: right;
    color: #fff;
    background-color: #1272b8;
    margin-top: 20px;
    line-height: 35px;
    font-size: 16px;
    box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
    cursor: pointer;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    padding-left: 60px;
    border: 5px solid #1272b8;
    transform: rotate(0deg);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.comment-submit:not(.active):hover{
    background-color: #0e5386;
    border-color: #0e5386;
    box-shadow: 2px 2px 3px rgba(0,0,0,0.5);

}

.comment-submit.active{
    width: 40px;
    height: 40px;
    background-color: transparent;
    background-image: none;
    font-size: 0;
    margin-right: 65px;
    padding-left: 0;
    border: 5px solid #1272b8;
    border-radius: 50%;
    border-top-color: transparent;
    box-shadow: none;
    animation: rotate 1s linear infinite;
    animation-delay: .3s;
}

@keyframes rotate {
    to {
        transform: rotate(360deg)
    }
}

.comment-restrict{
    float: left;
    width: calc( 100% - 300px );
    color: #a94442;
    margin-top: 20px;
}

.comments-block{
    width: 100%;
    float: left;
    margin-top: 15px;
}

.comment-item{
    width: 100%;
    float: left;
    border-bottom: 1px solid #ddd;
    padding: 15px;
    margin-top: 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.comment-nick{
    width: 50%;
    float: left;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 0;
}

.comment-date{
    width: 50%;
    float: left;
    color: #c0c0c0;
    text-align: right;
    font-size: 14px;
    margin-bottom: 0;
}

.comment-text{
    width: 100%;
    float: left;
    margin-top: 15px;
    font-size: 15px;
}

.comment-captcha{
    float: left;
    margin-left: 0px;
    margin-top: 20px;
    width: 0;
    height: 110px;
    position: relative;
    -webkit-transition: all .3s;
    -moz-transition: all .3s ;
    -ms-transition: all .3s ;
    -o-transition: all .3s ;
    transition: all .3s ;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.comment-thanks{
    display: none;
    float: right;
    margin-top: 35px;
}

.reply-comment{
    padding-left: 80px;
}

.reply-comment .comment-nick{
    color: #ff9103 !important;
}

.reply-comment .comment-date{
    color: #ff9103 !important;
}


@media screen and (max-width: 1024px) {
    .comment-restrict {
        float: none;
        width: 100%;
    }
    .comment-submit {
        float: none;
    }
}

@media screen and (max-width: 380px) {
    .comment-form input{
        width: 100%;
    }
}